el-table表格动态显示日期表头

在 element-ui 的 el-table 表格组件中，如果要动态显示日期表头，可以使用 slot-scope 属性自定义表头，结合 moment.js 库来格式化日期。

首先，需要在 el-table-column 中设置 prop 属性为日期字段，在 el-table 中设置 :data 属性为数据数组。然后，在 el-table-column 中使用 slot-scope 属性来自定义表头，其中，可以使用 moment.js 库对日期进行格式化。

示例代码如下：

<template>
  <el-table :data="tableData">
    <el-table-column
      prop="date"
      label="日期"
      width="180">
      <template slot-scope="scope">
        {{ moment(scope.row.date).format('YYYY-MM-DD') }}
      </template>
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名"
      width="180">
    </el-table-column>
  </el-table>
</template>

<script>
import moment from 'moment';

export default {
  data() {
    return {
      tableData: [
        {
          date: '2022-01-01',
          name: '张三'
        },
        {
          date: '2022-01-02',
          name: '李四'
        },
        {
          date: '2022-01-03',
          name: '王五'
        }
      ]
    }
  },
  computed: {
    moment() {
      return moment;
    }
  }
}
</script>

在上面的示例代码中，我们引入了 moment.js 库，并在 computed 中定义了 moment 方法，以便在模板中使用。在 el-table-column 中，使用 slot-scope 属性来自定义表头，并使用 moment 方法对日期进行格式化，最终显示为 YYYY-MM-DD 格式的日期表头。

需要注意的是，如果在 el-table-column 中使用了 slot-scope 属性来自定义表头，那么 label 属性将会被忽略。