vue2.0_在vue中使用moment.js插件格式化日期时间

前言

1、相信大家平时做项目的时候经常会遇到需要操作日期，获取日期等操作，一般大家都是通过new Date()去一步一步获取，这样做反而非常麻烦。今天给大家介绍一个功能强大，代码量少，快捷又方便的日期处理插件。
2、废话不多说，看代码：

首先

npm install --save vue-moment

其次

在main.js中使用插件

Vue.use(require('vue-moment'));

然后

我们只需要在需要用到的页面中通过以下形式调用即可。

//比如我们想获取当前的日期，就在this.moment中加入new Date()
//format 用于帮我们转化时间的格式
this.start1 = this.$moment(new Date()).format('YYYY-MM-DD');
this.start2 = this.$moment(new Date()).format('YYYY-MM-DD HH:mm:ss');
console.log(this.start1);//结果：2021-01-11
console.log(this.start2);//结果：2021-01-11 15:38:24

接下来，给大家提供更多相关的日期操作。

类型

①. 获取当天时间

this.$moment(new Date()).format('YYYY-MM-DD HH:mm:ss');

②. 自由转换任意时间的格式

this.$moment(需要转换的时间).format(格式自己定义);

③ . 获取前一天、后一天

//new Date() 可换成自己需要的时间
//前一天
this.$moment().add(1,'days');
this.$moment().add(1,'d');//简写
//后一天
this.$moment().add(-1,'days');
this.$moment().add(-1,'d');//简写

同理可获取上周、下周；上个月、下个月；去年，明年；

不清楚add(1，‘？？？’)括号后面字段名写什么的，请看上面的类型图。

④ . 获取每周的开始时间和结束时间

// 开始时间
this.$moment().startOf('week').format('YYYY-MM-DD');
//结束时间
this.$moment().endOf('week').format('YYYY-MM-DD');

同理可获取每月、每季、每年的开始时间和结束时间

⑤ . 链式添加时间

this.$moment().add(7, 'days').add(1, 'months');

⑥ . 使用对象添加时间

this.$moment().add({days:7,months:1});

⑦ . 时间间隔duration

var duration = this.$moment.duration({'days' : 1});
this.$moment().add(duration); 

⑧ . 指定特地日期时间

this.$moment("2018-01-28").format('YYYY-MM-DD');
this.$moment("2018-01-28").add(1, 'months');

其它

//获取时间戳 
this.$moment(Date.now(), 'YYYY-MM-DD HH:mm:ss').valueOf();