v-select 将值绑定到对象

Question

我有一个以这种方式映射对象的 v-select：

<v-select
      v-model="object"
      :items="objectsArray"
      label="Select Object"          
      item-text="name"
      item-value="id"
></v-select>

地点：

• 对象具有以下结构：{'id': 'Foo','name':'Bar'}
• 而 ObjectsArray 是一个结构相同的对象数组 {'id': 'Foo','name':'Bar'}

事情是这样的：当初始渲染发生时，在选择中显示 name 属性可以正常工作，但是当更改对象变为带有所选项目的 'name' 的字符串时，即 'Bar' 。

问题： 1-如何用所选项目的完整值替换对象，即：{'id':'Foo','name':'Bar'} 而不是仅 item-text 属性。 2-如何仅用 id 属性替换对象，即'Foo'。

观察： 如果从v-select 中删除item-text。在选择但更改更新对象上显示[Object object]，在本例中为 id 具有 item-value 属性。

Answer 1

1.

<v-select
      v-model="object"
      :items="objectsArray"
      label="Select Object"          
      item-text="name"
      item-value="id"
      return-object
></v-select>

1. v-model 始终反映在item-value 中定义的属性值，而不是item-text。因此，在您的示例中，选择将显示 Bar 和 v-model 将具有 Foo 的值