场景
在使用el-table显示数据时,请求后台数据获取的时间格式是 时间戳 格式,那我们怎么办,现在需要将其格式化时间格式并显示
实现
1.安装moment
npm install moment --save
2.main.js全局引入moment
import moment from 'moment'//导入文件
Vue.prototype.$moment = moment;//赋值使用
3.然后在el-table中需要格式化的那一列添加:formate
<el-table-column label="登录时间" align="center" prop="bindTime" width="180" :formatter="dateFormat"/>
4.然后在method中将方法dateFormat实现
methods: {
//时间格式化
dateFormat:function(row, column) {
var date = row[column.property];
if (date == '') {
return "";
}
return $moment(date).format("YYYY-MM-DD HH:mm:ss");
},
5.格式化之后的效果
6.注: 如果使用的是element ui 表格,可以在表格中直接将时间戳转为时间格式,这一点非常好用!
(此步直接替换3和4)
<el-table-column
prop="visitDate"
label="开始时间">
<template slot-scope="scope">
{{$moment(scope.row.visitDate).format("YYYY-MM-DD HH:mm:ss")}}
</template>
</el-table-column>