date-fns日期工具的使用方法

最新推荐文章于 2025-03-02 22:12:12 发布

贝塔贝卡贝

最新推荐文章于 2025-03-02 22:12:12 发布

阅读量7.2k

点赞数 1

文章标签：前端 vue

原文链接：https://zhuanlan.zhihu.com/p/354019460

版权

date-fns是一个非常好用的JS时间处理库,同时支持浏览器和NodeJS环境,而且使用方便,API全面,下面就为大家简单介绍一下使用方法

GitHub地址：
date-fns：https://github.com/date-fns/date-fns

特点

API数量多,全面,健壮: 数量高达180+
模块化: 使用的时候引入自己需要的API即可,轻便
不可变性和纯粹性: API都是纯函数
支持TS
支持国际化

安装

# 使用npm
npm install --save date-fns

# 或使用yarn
yarn add date-fns

使用示例
先引入

import { format } from 'date-fns'; // 其它方法也是先引入后使用

日期转字符串

如：2020/4/6 14:07:34
const now = new Date();
const nowStr = format(now, 'yyyy-MM-dd HH:mm:ss'); // 2020-04-06 14:07:34

const nowStr = format(now, 'yyyy-MM-dd hh:mm:ss'); // 2020-04-06 02:07:34

字符串转日期

const date = parseISO('1990-12-17'); // Mon Dec 17 1990 00:00:00 GMT+0800 (中国标准时间)

日期的计算

const tomorrow = addDays(new Date(), 1); // 明天,其它的方法类似,如: addHours / addMinutes 等
const yesterday = subDays(new Date(), 1); // 昨天, 其它的方法类似,如: subYears / subMonths 等

日期的比较

const number = compareAsc(date1, date2); // 若date1大于date2,则返回1;若date1小于date2则返回-1,相等则返回0

计算日期差

const years = differenceInYears(date1, date2); // 相差的年份,其它类似

与其它时间工具库的比较
monent: 体积最大,功能稍强,同时支持全局导入

dayjs: 体积基本上与date-fns一致,支持全局导入

date-fns: 体积较小,功能基本上可以代替moment,不支持全局导入

在这里插入图片描述