本文已参与[新人创作礼]活动，一起开启掘金创作之路。

Vue.filter(过滤器的名称,处理函数)

1. 在main.js中声明

Vue.filter("forMat", (data) => {
  var t = new Date(data);
  console.log(t, 88);
  var yy = t.getFullYear();
  var mm = (t.getMonth() + 1).toString().padStart(2, 0);
  var dd = t.getDate().toString().padStart(2, 0);
  return `${yy}-${mm}-${dd}`;
});

这里的.getDate()用来获取日期

这里的.toString()用来将得到的日期转为字符串，因为.padStart为ES6新增的字符串的方法

这里的.padStart(2, 0)的意思为是否为两位数，不是则在前加'0'

2.在`.vue`中使用（注：如果你原本获取到的数据中存在时间数据可将t替换为此数据）

{{ t | forMat("YYYY-MM-DD") }}

3.结果如图

4.练习：

如何得到如下数据

扩展：使用第三方插件dayjs处理

1.下包

yarn add dayjs

2.导包（main.js中）

注：如在项目中请将此操作移入到新建的文件中将其用js文件暴露出main，引入其即可

import dayjs from "dayjs";
Vue.filter("forMat", (data,p1) => {
  return dayjs(data).format(p1);
});

3.用包（注：根据dayjs格式使用）

{{ xxx | forMat("YYYY-MM-DD") }}

Vue2中获取日期和过滤器的使用