vue在表格增加一个行追加和删除行

在Vue中，我们可以使用`v-for`指令来渲染表格的行数据，并通过`v-model`指令来绑定表格数据。要实现在表格中增加和删除行的功能，可以按照以下步骤进行操作：

1. 在Vue组件的`data`属性中定义一个数组，用于存储表格的行数据，例如 `data: { items: [] }`。

2. 在表格中使用`v-for`指令来渲染每一行的数据，格式如下：

<table>
  <tr v-for="(item, index) in items" :key="index">
    <!-- 行数据的具体展示内容 -->
  </tr>
</table>

3. 在需要增加新行的地方，添加一个按钮，并绑定点击事件`@click`。

<button @click="addItem">添加行</button>

4. 在Vue组件的`methods`属性中添加一个名为`addItem`的方法，用于在行数据数组中添加一个新的空对象作为新行。

methods: {
  addItem() {
    this.items.push({});
  }
}

5. 在需要删除行的地方，给每一行的删除按钮绑定点击事件`@click`。

<tr v-for="(item, index) in items" :key="index">
  <!-- 行数据的具体展示内容 -->
  <td>
    <button @click="deleteItem(index)">删除</button>
  </td>
</tr>

6. 在Vue组件的`methods`属性中添加一个名为`deleteItem`的方法，用于根据索引从行数据数组中删除对应的行。

methods: {
  deleteItem(index) {
    this.items.splice(index, 1);
  }
}

通过以上步骤，在Vue中就可以实现在表格中追加和删除行的功能了。