Day.js 是一个轻量的处理时间和日期的 JavaScript 库。平时项目中笔者也常用dayjs,它确实很好用。Day.js有着几乎和Moment.js一样的API,因此如果你用过Moment.js,那么也可以轻松使用Day.js。本文将讲解项目中最常用的时间日期处理方法。
此外,Moment.js目前维护升级不太明了,而Day.js始终在维护,并且Day.js只有2KB大小,比Moment.js小很多。我们一般在Vue项目中使用,当然实际它与你用什么框架无关。
安装
我们使用npm安装day.js。
npm install dayjs --save
知识兔然后使用import引入day.js。
import dayjs from 'dayjs'
知识兔使用
1.当前时间
想要获取当前时间,只需一句代码:
dayjs()
知识兔要想将时间格式化输出,可以使用format:
dayjs().format('YYYY-MM-DD HH:mm:ss')
知识兔2.解析时间戳
dayjs可以接收一个时间戳(毫秒)参数,并将其转换为时间格式:
dayjs(1601121636123).format('YYYY-MM-DD HH:mm:ss')
知识兔3.N时间前
day.js可以轻松获取N小时/天/月/年前等时间,如以下代码获取的是一个月前的时间:
dayjs().subtract(1, 'month')
知识兔代码中用来表示月份参数:month,可以换成其他表示不同的时间单位:year(年),month(月),day(日),hour(时),minute(分),second(秒),millisecond(毫秒),week(周)。
4.N时间后
day.js也可以轻松获取N时间后的时间,如以下代码获取的是7天后的时间:
dayjs().add(7, 'day')
知识兔5.开始时间
day.js可以获取一月/一周等的开始时间,如以下代码获取本周第一天的时间(星期一):
dayjs().startOf('week')
知识兔6.末尾时间
day.js可以获取一月/一周等的末尾时间,如以下代码获取本月最后一天时间:
dayjs().endOf('month')
知识兔7.两个时间差
day.js可以获取两个不同时间的差,如2020-09-25和2020-06-05相差112天:
const date1 = dayjs('2020-09-25');
date1.diff('2020-06-05', 'day'); // 112
知识兔8.Unix 时间戳
day.js可以轻松转换秒级和毫秒级时间戳:
dayjs().unix(); //秒
dayjs().valueOf(); //毫秒
知识兔9.获取月份天数
day.js可以轻松获取一个月的天数是30天还是31天还是28或29天。
dayjs().daysInMonth() //30,(2020年9月共30天)
知识兔10.距离当前时刻
我们经常看到显示“1分钟前”、“3小时内”等时间转换后显示效果,dayjs也可以轻松实现:
dayjs('2020-09-27 18:22:32').fromNow(); //3小时前
dayjs('2020-09-26 10:22:32').toNow(); //1天内
知识兔fromNow()
表示距离当前时刻,toNow()
表示相对当前时刻,其实感觉意思差不多。
不过要想fromNow()
和toNow()
生效,需要使用插件 RelativeTime
,方法是先引入插件,再执行调用方法:
import relativeTime from 'dayjs/plugin/relativeTime';
dayjs.extend(relativeTime);
知识兔11.中文本地化
如果要像上面输出“1分钟前”这样的中文内容,需要引入中文语言包:
import 'dayjs/locale/zh-cn';
dayjs.locale('zh-cn');
知识兔使用以上两句代码后,就可以愉快的输出中文了。
12.格式化时间
使用day.js的 format()
可以轻松格式化你需要的时间格式了,如以下代码输出时间格式:2020-09-27 20:57:04
dayjs().format('YYYY-MM-DD HH:mm:ss')
知识兔以下表格是从官网摘录的支持时间格式单位:
格式 | 输出 | 描述 |
格式 | 输出 | 描述 |
YY | 19 | 两位数年份 |
YYYY | 2019 | 四位数年份 |
M | 1~12 | 月份,从1开始 |
MM | 01~12 | 月份,两位数 |
MMM | Jan~Dec | 简写的月份名称 |
MMMM | January-December | 完整的月份名称 |
D | 1~31 | 月份里的一天 |
DD | 01~31 | 月份里的一天,两位数 |
d | 0~6 | 一周中的一天,星期天是0 |
dd | Su~Sa | 最简写的一周中一天的名称 |
ddd | Sun-Sat | 简写的一周中一天的名称 |
dddd | Sunday-Saturday | 一周中一天的名称 |
H | 0~23 | 小时 |
HH | 00~23 | 小时,两位数 |
h | 1~12 | 小时,12小时制 |
hh | 01~12 | 小时,12小时制,两位数 |
m | 0~59 | 分钟 |
mm | 00~59 | 分钟,两位数 |
s | 0~59 | 秒 |
ss | 00~59 | 秒,两位数 |
SSS | 000~999 | 毫秒,三位数 |
Z | +5:00 | UTC的偏移量 |
ZZ | +500 | UTC 的偏移量,数字前面加上 0 |
A | AM PM | |
a | am pm |
Day.js的github项目地址: https://github.com/iamkun/dayjs