您现在的位置是:首页 > 网站制作 > vue.js心得vue.js心得
vue 使用moment时间处理插件
蒙xs2021-04-20【vue.js心得】人已围观
简介1.引入import moment from 'moment'获取当前时间let now = moment();console.log(now) // 当前时间对象格式化let now = moment().format('YYYY-MM-DD HH:mm:ss
使用npm命令安装moment
npm install moment --save
1.引入
import moment from 'moment'
获取当前时间
let now = moment();
console.log(now) // 当前时间对象
格式化
let now = moment().format('YYYY-MM-DD HH:mm:ss');
console.log(now);
// 2018-12-14 16:00:08
示例 - 获取周几
// 先获取星期中的第几天0-6,0是周日
let now = moment().format('d');
let weekStr = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
let week = weekStr[now];
console.log(weekStr);
// 输出周x
算法
可以轻松计算某个日期后多少天,两个日期差,两个日期比较等。
当前日期后20天
let now = moment('2018-12-14').add(20, 'day').format('YYYY-MM-DD');
console.log(now);
// 输出 2019-01-03
diff计算两个日期差
let diff = moment('2019-01-03').diff(moment('2018-12-14'));
console.log(diff);
// 1728000000 单位是毫秒
diff时间差格式化
let starttime = '2018-12-14 18:00';
let endtime = '2018-12-15 10:22';
var totalMinute = moment(endtime).diff(starttime) / (1000 * 60),
hours = Math.floor(totalMinute / 60),
minute = totalMinute % 60,
result = '';
if(hours > 0){
result = result + hours + '小时';
}
if(minute > 0){
result = result + minute + '分钟';
}
console.log(result);
// 16小时22分钟
两个日期比较
// 是否之前 moment('2018-10-20').isBefore('2018-12-31', 'year'); // false moment('2018-10-20').isBefore('2019-01-01', 'year'); // true moment('2018-10-20').isBefore('2019-01-01'); // true // 是否之后 moment('2010-10-20').isAfter('2010-01-01', 'year'); // false moment('2010-10-20').isAfter('2009-12-31', 'year'); // true // 是否相同 moment('2010-10-20').isSame('2009-12-31', 'year'); // false moment('2010-10-20').isSame('2010-01-01', 'year'); // true moment('2018-01-01').isSame('2018-01-01'); // true // 是否是闰年 moment([2000]).isLeapYear() // true moment([2001]).isLeapYear() // false 定义全局过滤器
// 全局引入 (main.js) import moment from 'moment' // 全局过滤器 时间戳 使用 Vue.filter('dateformat', function (dataStr, pattern = 'YYYY-MM-DD') { if (dataStr) { return moment(dataStr).format(pattern) } else { return dataStr } }) // 页面使用过滤 如: <cell title="还款日" :value="data | dateformat('YYYY-MM-DD HH:mm:ss')"></cell>该帖子只做记录,转自http://www.javanx.cn/20181214/moment-js/
Tags:
很赞哦! ()
上一篇:使用day.js格式化时间