el-table-column动态生成列

在 Element UI 的表格组件 `el-table` 中，可以通过 `el-table-column` 组件来定义表格的列。如果需要动态生成列，可以通过以下步骤实现：

1. 维护一个数组，存储表格的列信息。

data() {
  return {
    columns: [
      { label: '姓名', prop: 'name' },
      { label: '年龄', prop: 'age' },
      { label: '性别', prop: 'gender' }
    ],
    data: [
      { name: '张三', age: 18, gender: '男' },
      { name: '李四', age: 20, gender: '女' }
    ]
  };
}

2. 在模板中使用 `v-for` 指令遍历 `columns` 数组，动态生成 `el-table-column` 组件。

<el-table :data="data">
  <el-table-column v-for="column in columns" :key="column.prop" :label="column.label" :prop="column.prop"></el-table-column>
</el-table>

3. 如果需要动态添加或删除列，只需要操作 `columns` 数组即可。Vue 会自动响应式更新表格列。

// 添加一列
this.columns.push({ label: '电话', prop: 'phone' });

// 删除一列
this.columns.splice(1, 1);

以上就是动态生成 `el-table-column` 的方法。