怎样用v-for动态生成el-table-column

要使用 `v-for` 动态生成 `el-table-column`，你可以在 `el-table` 中使用 `:columns` 属性，并将其绑定到一个包含列配置的数组。在这个数组中，你可以使用 `v-for` 循环来生成每个列的配置。以下是一个示例：

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

<script>
export default {
  data() {
    return {
      // 表格数据
      tableData: [],
      // 表格列配置
      tableColumns: [
        { label: '姓名', prop: 'name' },
        { label: '年龄', prop: 'age' },
        { label: '性别', prop: 'gender' },
        // 使用 v-for 循环动态生成列配置
        // 可以根据需要添加、删除、修改列
        // 这里只是一个示例，可以根据实际情况修改
        ...[
          { label: '手机号码', prop: 'phone' },
          { label: '邮箱地址', prop: 'email' }
        ].map(column => ({
          ...column,
          // 这里可以根据需要添加、删除、修改列的其他属性
          // 这里只是一个示例，可以根据实际情况修改
          width: '200px'
        }))
      ]
    }
  }
}
</script>

在这个示例中，我们首先定义了一个包含表格数据和列配置的数组。然后，我们在模板中使用 `el-table` 组件，并将 `:data` 属性绑定到表格数据，将 `:columns` 属性绑定到包含列配置的数组。在这个数组中，我们使用 `v-for` 循环来生成每个列的配置，然后将这些配置合并到一个数组中，并将这个数组作为表格的列配置。这样，我们就可以根据需要动态生成 `el-table-column`。