element ui 表格时间戳转换-展示日期时间

2019-07-12  本文已影响0人  嫑着急
npm install moment --save

script引入

import moment from ' moment'

设置表格:formatter="dataFormat"

<el-table-column label="下单时间" prop="addtime" show-overflow-tooltip :formatter="dateFormat" width="auto"></el-table-column>

绑定一个dataFormat方法

methods: {
            dateFormat: function(row, column) {
                var date = row[column.property];
                if (date == undefined) {
                    return "";
                }
                return moment(date).format("YYYY-MM-DD HH:mm:ss");
            },
}

过滤器时间戳转换

<p style="color: #999;font-size: 12px;" v-if="last_login_time">{{last_login_time | formatDate}}</p>
 import moment from 'moment'

formatDate: function(value) {
            // console.log(value)
            return moment(value * 1000).format('YYYY-MM-DD-HH:mm:ss')
            // console.log(moment(this.dpgl[0].business_date_start).format('YYYY-MM-DD'))
}

//全局过滤器(时间戳转换时间)

import moment from 'moment'
Vue.filter('dataFormat',function(data){     //全局过滤器(时间戳转换时间)
  return moment(data*1000).format('YYYY-MM-DD-HH:mm:ss')
})
//实例
<el-table-column prop="last_login_time" label="最后登录时间" show-overflow-tooltip width="auto" align='center'>
        <template slot-scope='scope'>
          <span>{{scope.row.last_login_time | dataFormat}}</span>
        </template>
</el-table-column>
上一篇 下一篇

猜你喜欢

热点阅读