vxe-table 动态

vxe-table支持动态修改表格数据，可以通过以下步骤实现：

1. 在 data 中定义表格的列和数据。例如：

data() {
  return {
    columns: [
      {title: '姓名', key: 'name'},
      {title: '年龄', key: 'age'},
      {title: '性别', key: 'gender'}
    ],
    tableData: [
      {name: '张三', age: 18, gender: '男'},
      {name: '李四', age: 20, gender: '女'},
      {name: '王五', age: 22, gender: '男'}
    ]
  }
}

2. 在 template 中定义表格组件，并使用 columns 和 tableData 来渲染表格。例如：

<template>
  <vxe-table :columns="columns" :data="tableData"></vxe-table>
</template>

3. 动态修改表格数据。可以通过修改 tableData 数组来动态修改表格数据。例如：

this.tableData.push({name: '赵六', age: 24, gender: '女'})

这样就可以在表格中新增一行数据了。

this.tableData[0].age = 20

这样就可以修改表格中第一行数据的年龄了。

需要注意的是，如果动态修改了表格的列数或列名，可能需要重新渲染表格才能生效。可以使用 vxe-table 的 $refs 属性来获取表格实例，然后调用实例的 refresh 方法来重新渲染表格。例如：

this.columns.push({title: '地址', key: 'address'})
this.$refs.table.refresh()