vue中使用ele组件table实现动态列

在Vue中使用Element UI的<el-table>组件实现动态列，你可以通过v-for指令动态渲染列，并使用:key绑定一个唯一值以保证列的key的唯一性。

以下是一个简单的例子：

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column
      v-for="column in dynamicColumns"
      :key="column.prop"
      :prop="column.prop"
      :label="column.label">
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      dynamicColumns: [
        { label: '日期', prop: 'date' },
        { label: '姓名', prop: 'name' },
        // 你可以根据需要动态添加或删除列
      ],
      tableData: [
        { date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' },
        // ...更多数据
      ]
    };
  }
};
</script>

在这个例子中，dynamicColumns数组定义了表格的动态列，tableData数组提供了表格的数据。el-table-column使用v-for根据dynamicColumns数组动态创建列，并通过:prop和:label绑定相应的列属性和标题。