vue前台需要用户能看得懂的时间格式如常见的“2021-03-10 12:02:35”,但是后台数据库则需要时间格式如LocalDateTime(“2021-03-10T15:31:01”)或者Date类型的,如果数据不经过处理,直接显示,肯定可读性差。
下边就介绍一下前台vue处理方式,就是在vue项目的main.js中创建一个过滤器,把时间格式化处理。
Vue.filter('dataFormat', function (originVal) {
const dt = new Date(originVal)
const y = dt.getFullYear()
const m = (dt.getMonth() + 1 + '').padStart(2, '0')
const d = (dt.getDate() + '').padStart(2, '0')
const hh = (dt.getHours() + '').padStart(2, '0')
const mm = (dt.getMinutes() + '').padStart(2, '0')
const ss = (dt.getSeconds() + '').padStart(2, '0')
// yyyy-mm-dd hh:mm:ss
return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
})
在需要进行格式化处理的地方直接引用即可,此处以element中的表格引用为例
<el-table-column label="使用有效期">
<template slot-scope="scope">{{scope.row.beginTime | dataFormat}}</template>
</el-table-column>