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

Question

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

  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]") 但它不起作用。

标签： javascriptvue.js

Answer 1

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

如果 dataArray 中的所有对象都具有不同的属性，则应使用 Object.keys() 创建对象键数组并使用它们来获取所有属性值。（有关示例，请参见此问题）。