vue中，一个表格初始化值为[{name:'',value:'',index:0}]，点击新增按钮后表格值更新为[{name:'',value:'',index:0},{name:'',value:'',index:1},{name:'',value:'',index:2}],怎么确保每行输入值，其他行不受影响

你可以使用 Vue 的 computed 属性来实现这个功能。首先，在 data 中定义一个数组变量 tableData 来存储表格数据。然后，定义一个 computed 属性来生成一个包含初始值的新数组 newTableData，这个属性会在每次新增数据时更新。

在模板中，使用 v-for 指令来遍历 newTableData 数组，生成表格的每一行。每一行的输入框的 v-model 绑定到当前行的数据对象中的 name 和 value 属性上，这样每一行输入的值都只会影响当前行的数据对象，而不会影响其他行。

下面是示例代码：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>Name</th>
          <th>Value</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="row in newTableData" :key="row.index">
          <td><input type="text" v-model="row.name"></td>
          <td><input type="text" v-model="row.value"></td>
        </tr>
      </tbody>
    </table>
    <button @click="addRow">Add Row</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [{ name: '', value: '', index: 0 }]
    };
  },
  computed: {
    newTableData() {
      return this.tableData.concat([{ name: '', value: '', index: this.tableData.length }]);
    }
  },
  methods: {
    addRow() {
      this.tableData.push({ name: '', value: '', index: this.tableData.length });
    }
  }
};
</script>

在这个示例中，每次点击 "Add Row" 按钮，都会调用 addRow 方法，向 tableData 数组中添加一个新的数据对象，然后 computed 属性 newTableData 会自动更新，生成一个包含所有数据对象的新数组。这样就能实现每行输入值，其他行不受影响的功能了。