vue3 element-plus el-table表格日期分为两行

vue yekong

vue3 element-plus el-table表格日期分为两行

vue3 element-plus el-table表格客户要求日期分为两行,一行显示年月日,一行显示时分秒

处理代码

<el-table :data="list" class="custom-table" style="width: 100%">
      <el-table-column align="center" label="采样时间">
        <template #default="scope">
          <div v-html="formatSamplingTime(scope.row.samplingTime)"></div>
        </template>
      </el-table-column>
    </el-table>

引入dayjs

import dayjs from "dayjs";

处理方法

methods: {
    formatSamplingTime(row, column, cellValue) {
      // 将日期和时间分为两行,日期在第一行,时间在第二行
      return dayjs(cellValue).format('YYYY-MM-DD') + '<br>' + dayjs(cellValue).format('HH:mm:ss');
    }
  }
喜欢