el-table-column 中怎么过滤后台来的毫秒数

Question

<el-table-column

   property ="CreateTime"

   label="发送时间"

   width=400>

</el-table-column>

Answer 1

有两种方法来实现，第一种是写一个过滤器（filter），使用插值替换，第二种是使用一个方法来处理。推荐第一种，复用性强。第一种，定义过滤器。定义一个过滤器，将时间处理成到时分秒的时间：Vue.filter('dateTimeFormat', (value) => {&nbsp; &nbsp; var time = new Date(+value);&nbsp; &nbsp; var rightTwo = (v) => {&nbsp; &nbsp; &nbsp; v = '0' + v&nbsp; &nbsp; &nbsp; return v.substring(v.length - 2, v.length)&nbsp; &nbsp; }&nbsp; &nbsp; if (time == null) return;&nbsp; &nbsp; var year = time.getFullYear();&nbsp; &nbsp; var month = time.getMonth() + 1;&nbsp; &nbsp; var date = time.getDate();&nbsp; &nbsp; var hours = time.getHours();&nbsp; &nbsp; var minutes = time.getMinutes();&nbsp; &nbsp; var seconds = time.getSeconds();&nbsp; &nbsp; return year + '-' + rightTwo(month) + '-' + rightTwo(date) + ' ' + rightTwo(hours) + ':' + rightTwo(minutes) + ':' + rightTwo(seconds);}组件里怎么使用：<el-table-column&nbsp; &nbsp; property ="CreateTime"&nbsp; &nbsp; label="发送时间"&nbsp; &nbsp; width=400>&nbsp; &nbsp; <template scope="scope">&nbsp; &nbsp; &nbsp; &nbsp; {{ scope.row.CreateTime | dateTimeFormat }}&nbsp; &nbsp; </template></el-table-column>第二种，使用函数来处理。这个函数的逻辑跟过滤器是一样的，只是方式不同。methods: {&nbsp; &nbsp; dateTimeFormat(value) {&nbsp; &nbsp; &nbsp; &nbsp; var time = new Date(+value);&nbsp; &nbsp; &nbsp; &nbsp; var rightTwo = (v) => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; v = '0' + v&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return v.substring(v.length - 2, v.length)&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; if (time == null) return;&nbsp; &nbsp; &nbsp; &nbsp; var year = time.getFullYear();&nbsp; &nbsp; &nbsp; &nbsp; var month = time.getMonth() + 1;&nbsp; &nbsp; &nbsp; &nbsp; var date = time.getDate();&nbsp; &nbsp; &nbsp; &nbsp; var hours = time.getHours();&nbsp; &nbsp; &nbsp; &nbsp; var minutes = time.getMinutes();&nbsp; &nbsp; &nbsp; &nbsp; var seconds = time.getSeconds();&nbsp; &nbsp; &nbsp; &nbsp; return year + '-' + rightTwo(month) + '-' + rightTwo(date) + ' ' + rightTwo(hours) + ':' + rightTwo(minutes) + ':' + rightTwo(seconds);&nbsp; &nbsp; }}组件里怎么使用：<el-table-column&nbsp; &nbsp; property ="CreateTime"&nbsp; &nbsp; label="发送时间"&nbsp; &nbsp; width=400>&nbsp; &nbsp; <template scope="scope">&nbsp; &nbsp; &nbsp; &nbsp; {{ dateTimeFormat(scope.row.CreateTime) }}&nbsp; &nbsp; </template></el-table-column>由于第一种方法可以将过滤器设置到全局，所以可以只定义一次，然后项目中可任意使用。