vue时间过滤器

vue时间过滤器

有时候后端返回的数据并没有对时间做处理，需要我们前端来做处理，那么我们就加一个时间过滤器

一、第一种情况
1、先安装插件

npm install moment --save 

2、在main.js中引入和使用

//事件过滤器
import moment from 'moment'


Vue.filter('DateTime', function (value) {
  return moment(value).format('YYYY-MM-DD HH:mm:ss')
})

3、在页面中的使用

4、结果就是
2021-6-08 14:04:56

二、第二种情况
1、安装依赖

npm install dayjs --save

2、封装一个js文件

//时间格式是年月日时分秒
const format = (date = Date.now(), _format = 'YYYY-MM-DD HH:mm:ss') => {
  return dayjs(date).format(_format);
}
//时间格式是年月日的
const formatyear = (date = Date.now(), _formatyear = 'YYYY-MM-DD HH:mm:ss') => {
  return dayjs(date).format(_formatyear);
}

//导出
export default {
	format,
	formatyear
}

3、在页面中的应用

import utils from "@/utils/common"; //封装时间的文件路径，utils名称可以随便起一个

//应用到需要转换时间的地方
response.list.map((item) => {
	item.createTime = utils.format(item.createTime); //2021-6-08 14:04:56
});

response.list.map((item) => {
	item.createTime = utils.formatyear(item.createTime); //2021-6-08
});