0

我正在尝试使用 v-for 和模板创建多个 vuetify-textfields,因此我可以轻松地添加和编辑文本字段,同时保持我的代码干净。

模板标签:

<template v-for="obj in textFieldProps">
  <v-text-field
    :ref="obj.ref"
    v-model="obj.model"
    :label="obj.lbl"
  ></v-text-field>
</template>

我当前的数据如下所示:

export default {
  data: () => ({
    name: '',
    lastname: '',
    textFieldProps: [
      { ref: 'name', model: 'name', lbl: 'Name' },
      { ref: 'lastname', model: 'lastname', lbl: 'Lastname' }
    ]
  })
}

我知道这个问题被问过多次,但每个答案都是:动态绑定 v-model 通过创建一个额外的数组来工作,你可以在其中保护你的数据(在我的示例中为姓名和姓氏)。

但这感觉像是一个笨拙的解决方法。那么有什么办法可以直接将 v-model 绑定到 this.name/this.lastname 上呢?

4

1 回答 1

0

您只能将 v-model 绑定到一个表单输入。要将每个输入绑定到 v-model,您必须在添加新输入字段时创建一个附加数组

https://vuejs.org/v2/guide/forms.html

于 2019-04-26T08:14:34.453 回答