若依vue前端处理日期数据的格式问题(只留下年月日,去掉时分秒)
若依系统的表格展示时间修改需要如图调整,若依vue前端日期格式的数据只留下年月日,去掉时分秒
在main.js里面有一个parseTime全局方法挂载:
这是框架自带的日期格式化方法,具体实现如下:
// 日期格式化
export function parseTime(time, pattern) {if (arguments.length === 0 || !time) {return null}const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'let dateif (typeof time === 'object') {date = time} else {if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {time = parseInt(time)} else if (typeof time === 'string') {time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');}if ((typeof time === 'number') && (time.toString().length === 10)) {time = time * 1000}date = new Date(time)}const formatObj = {y: date.getFullYear(),m: date.getMonth() + 1,d: date.getDate(),h: date.getHours(),i: date.getMinutes(),s: date.getSeconds(),a: date.getDay()}const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {let value = formatObj[key]// Note: getDay() returns 0 on Sundayif (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }if (result.length > 0 && value < 10) {value = '0' + value}return value || 0})return time_str
}
表格元素使用方法如下:
<el-table-column prop="overtime" label="冰淇淋折扣结束日期" align="center" width="100" :show-overflow-tooltip="true"><template slot-scope="scope"><span>{{ parseTime(scope.row.overtime, '{y}-{m}-{d}') }}</span></template></el-table-column>