vuetify.js - 如何在多个启用的 v-select 组件中预先选择选项？

Question

我有一个 v-select 组件，允许用户从组合“倍数”选项中进行选择。

            <v-select
              dense
              :items="merchants"
              item-text="name"
              item-value="id"
              name="merchants"
              v-model="editedItem.merchants"
              return-object
            >
            </v-select>

items 是一个对象列表，并且 v-select 已正确填充。v-model 是 api 返回的对象数组。

如此捕获中所示：

但是当 v-select 打开时，没有项目“已经”被选中。

v-model 中应该使用的数据类型如何，让 v-select 将列表中的项目与所选项目“匹配”。

谢谢

和最好的问候

Answer 1

只需在其中指定您的 APImerchants数据v-model，所有这些对象都会被选中。并且不要忘记添加item-text和item-value道具。

演示

https://codepen.io/aQW5z9fe/pen/JjYmoVb

<v-select
  v-model="selected"
  :items="items"
  item-text="name"
  item-value="id"
  label="Select"
  multiple
></v-select>

data () {
  return {
    items: [
      {
        id: 0,
        name: 'merchant-1'
      },
      {
        id: 1,
        name: 'merchant-2'
      }
    ]
  } 
},
computed: {
  APIdata () {
    const merchants = [
      {
        id: 0,
        name: 'merchant-1'
      }
    ]
    return merchants
  }
}