vue 往表格中添加数据

要往表格中添加数据，可以通过以下步骤：

1. 定义表格数据

在 Vue 实例中，定义表格数据，例如：

data() {
  return {
    tableData: [
      { id: 1, name: '张三', age: 18 },
      { id: 2, name: '李四', age: 20 },
      { id: 3, name: '王五', age: 22 }
    ]
  }
}

2. 添加按钮

在表格上方添加一个按钮，点击该按钮可以弹出添加数据的对话框，例如：

<el-button type="primary" @click="addData">添加数据</el-button>

3. 实现添加数据方法

在 Vue 实例中，实现添加数据的方法，例如：

methods: {
  addData() {
    // 弹出对话框，输入数据
    // 示例中使用了 Element UI 的对话框
    this.$prompt('请输入数据', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消'
    }).then(({ value }) => {
      // 生成新的数据对象
      const newData = {
        id: this.tableData.length + 1,
        ...value
      }
      // 添加到表格数据中
      this.tableData.push(newData)
      // 提示添加成功
      this.$message.success('添加成功')
    }).catch(() => {
      // 取消操作，不需要做任何事情
    })
  }
}

在这个方法中，首先弹出对话框，输入需要添加的数据，然后生成一个新的数据对象，将其添加到表格数据中，最后提示添加成功。

完成上述步骤后，就可以实现往表格中添加数据了。