ElementUI问题:el-table-column中时间戳转年月日！

米粒宝的爸爸

于 2024-06-26 11:06:07 发布

阅读量133

点赞数 3

分类专栏：前端文章标签： elementui vue.js javascript

本文链接：https://blog.csdn.net/chenghao13834505361/article/details/139983773

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

问题来源：接口返回的时间是时间戳，但是要显示年月日或者年月日时分秒等。那么就需要来转下字段。

开始解题！

1.在el-table-column中加一个formatter属性。

 <el-table-column label="时间" align="center" prop="time" width="180"  :formatter="formatDate">
  </el-table-column>

2.这个方法接收当前行的数据row，当前列的信息column和单元格的值cellValue.

    formatDate(row, column, cellValue) {
      const date = new Date(cellValue);
      const year = date.getFullYear();
      const month = (date.getMonth() + 1).toString().padStart(2, '0');
      const day = date.getDate().toString().padStart(2, '0');
      return `${year}-${month}-${day}`;
    },

或者年月日时分秒

    formatDate(row, column, cellValue) {
      const date = new Date(cellValue); // cellValue即为时间戳
      const year = date.getFullYear();
      const month = (date.getMonth() + 1).toString().padStart(2, '0');
      const day = date.getDate().toString().padStart(2, '0');
      const hours = date.getHours().toString().padStart(2, '0');
      const minutes = date.getMinutes().toString().padStart(2, '0');
      const seconds = date.getSeconds().toString().padStart(2, '0');
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    }

完工！