Javascript 如何使用vue Js将对象值绑定到动态添加的输入字段

我在数组中有一个对象，它的属性和值是这样动态添加的

  dataArray: [
    {
      first_name: "john",
      last_name: "doe",
      age: "45"
    }
  ]

我想创建与对象属性对应的输入字段，所以我要这样做

<input v-for="(item,index) in dataArray[0]" :key="index" v-model="item[index]"></input>

已创建输入字段，但如何将值与对象属性绑定，

---

我尝试使用（v-model=“item[index]”），但它不起作用。

没有这样的数据

item[index]

，请尝试使用：

v-model="dataArray[0][index]"

---

在您的示例中，项是一个对象（dataArray[0]）。对象属性没有索引，因此无法执行您正在尝试的操作。项[索引]正在查找名为“0”、“1”和“2”的属性键，但该属性键不存在

---

若dataArray中的所有对象都具有不同的属性，则应使用object.keys（）创建对象键数组，并使用这些键获取所有属性值。（参见示例）。

在这种情况下不需要

索引，因为
项已表示值：

<input v-for="(item,index) in dataArray[0]" :key="index" v-model="item"></input>



然而，这种方法的问题是，您的模型不会是被动的。一种方法是这样做

将html更改为


将更改方法添加到Vue实例代码：

方法：{
更改（索引，val）{
this.dataArray[0][index]=val；
log（索引+'：'+val）；
}
}

事实上，我很想知道这方面的另一个解决方案是什么。
是的，我尝试了错误的指令，现在它工作正常。不是真的。您可以交替使用
item.index
以及
item[index]
。在上面的问题中，它起作用的是
dataArray[0][index]
，但由于某种原因，它不是
item[index]
，我正试图计算它，因为我很好奇。如果您更改
v-model=“item”
，它将在输入字段中打印您的值，但我认为这些值不会是被动的。