javascript - vuejs 动态使用 v-model

Question

我有基本的选择，我想绑定(bind)到空数组。我使用vuetify，但是这个问题是普遍的。

<v-select
v-model="items.physicianSpeciality"
>
</v-select>

现在我想对许多数组使用相同的选择，具体取决于 Offer.person 值，可以是医生、护士等。

data: {
offer.person: "physician" //or offer.person: "nurse"
}

例如，对于医生，我想使用 v-model items.physicianSpeciality 对于护士，我想使用 v-model items.nurseSpeciality 等。

我尝试做一些类似的事情:

<v-select
v-model="this['items.' + offer.person + 'Speciality']"
>
</v-select>

但这给了我一个错误:

[Vue warn]: Property or method "items.physicianSpeciality" 
is not defined on the instance but referenced during render. 
Make sure that this property is reactive, either in the data option, 
or for class-based components, by initializing the property. 

虽然这有效:

<v-select
v-model="items.physicianSpeciality"
>
</v-select>

这里出了什么问题？应如何更正我的代码才能使其正常工作？

Answer 1

改变

v-model="this['items.' + offer.person + 'Speciality']"

到

v-model="items[offer.person + 'Speciality']"