element-ui 表格數(shù)據(jù)時間格式化的方法
更新時間：2018年08月24日 10:27:46 作者：小馬哥的天涯
這篇文章主要介紹了element-ui 表格數(shù)據(jù)時間格式化的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
后臺返回時間格式 /1470220594000/
在element-ui table 如何格式化呢
1.首先
復制代碼 代碼如下:
<el-table-column prop="AuditEndTime" label="處理時間" width="120" :formatter="dateFormat" align="center"></el-table-column>
主要是:formatter="dateFormat" 這個屬性
formatter 用來格式化內容 Function(row, column, cellValue, index)
然后在 methods 方法對象里 添加 如下方法
//時間格式化
dateFormat(row, column, cellValue, index){
const daterc = row[column.property]
if(daterc!=null){
const dateMat= new Date(parseInt(daterc.replace("/Date(", "").replace(")/", ""), 10));
const year = dateMat.getFullYear();
const month = dateMat.getMonth() + 1;
const day = dateMat.getDate();
const hh = dateMat.getHours();
const mm = dateMat.getMinutes();
const ss = dateMat.getSeconds();
const timeFormat= year + "/" + month + "/" + day + " " + hh + ":" + mm + ":" + ss;
return timeFormat;
}
}
格式化后：
2018/2/27 8:59:19
PS：Element UI的表格table列的寬度自適應設置
不要設置 width="110px"
<el-table-column prop="login_id" align="center" label="工號"> </el-table-column> <el-table-column prop="login_id" width="110px" align="center" label="工號"> </el-table-column>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
本文主要介紹了vue3清空reactive的四種方式,包含使用?Object.assign,使用?Object.keys?和?for...in?循環(huán),使用?delete?操作符和重新賦值4種,感興趣的可以了解一下2024-03-03
使用 Vue-TCB 快速在 Vue 應用中接入云開發(fā)的方法
這篇文章主要介紹了如何使用 Vue-TCB 快速在 Vue 應用中接入云開發(fā),本文給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2020-02-02
本文主要介紹了Vue中接收二進制文件流實現(xiàn)pdf預覽的方法，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-12-12
這篇文章主要為大家詳細介紹了vue.js框架實現(xiàn)表單排序和分頁效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
公司最近有一個H5頁面的功能，比較簡單的一個調查表功能，嵌套在我們微信公眾號里面。這篇文章主要介紹了使用vue完成微信公眾號網(wǎng)頁小記,需要的朋友可以參考下2019-04-04
vue動態(tài)綁定class選中當前列表變色的方法示例
這篇文章主要介紹了vue動態(tài)綁定class選中當前列表變色的方法示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
這篇文章主要介紹了Vuex 快速入門(簡單易懂)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-09-09
vue移動端html5頁面根據(jù)屏幕適配的四種解決方法
在vue移動端h5頁面當中，其中適配是經(jīng)常會遇到的問題，這塊主要有四個方法可以適用。這篇文章主要介紹了vue移動端h5頁面根據(jù)屏幕適配的四種方案 ,需要的朋友可以參考下2018-10-10
vue使用directive限制表單輸入整數(shù)、小數(shù)的方法
這篇文章主要介紹了vue使用directive限制表單輸入整數(shù)，小數(shù),本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-04-04
這篇文章主要介紹了Vue頁面骨架屏注入的操作，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下2018-05-05