Moment.js常见用法

原创

用户4396583

发布于 2024-07-24 23:41:12

1K0

1、安装Moment.js

npm install moment
//或
yarn add moment

2、引入Moment.js

// require 方式
var moment = require('moment');

// import 方式
import moment from 'moment';

<script src="moment.js"></script>

3、设定moment区域为中国

// require 方式
require('moment/locale/zh-cn')
moment.locale('zh-cn'); 

// import 方式
import 'moment/locale/zh-cn'
moment.locale('zh-cn');

4、使用方法

4.1 获取时间

获取当前时间

moment()

获取今天0时0分0秒

moment().startOf('day')

获取本周第一天(周日)0时0分0秒

moment().startOf('week')

获取本周周一0时0分0秒

moment().startOf('isoWeek')

获取当前月第一天0时0分0秒

moment().startOf('month')

获取今天23时59分59秒

moment().endOf('day')

获取本周最后一天(周六)23时59分59秒

moment().endOf('week')

获取本周周日23时59分59秒

moment().endOf('isoWeek')

获取当前月最后一天23时59分59秒

moment().endOf('month')

获取当前月的总天数

moment().daysInMonth()

获取时间戳(以秒为单位)

moment().format('X') // 返回值为字符串类型
moment().unix() // 返回值为数值型

获取时间戳(以毫秒为单位)

moment().format('x') // 返回值为字符串类型
moment().valueOf() // 返回值为数值型

获取年份

moment().year()
moment().get('year')

获取月份

moment().month()  // (0~11, 0: January, 11: December)
moment().get('month')

获取一个月中的某一天

moment().date()
moment().get('date')

获取一个星期中的某一天

moment().day() // (0~6, 0: Sunday, 6: Saturday)
moment().weekday() // (0~6, 0: Sunday, 6: Saturday)
moment().isoWeekday() // (1~7, 1: Monday, 7: Sunday)
moment().get('day')
mment().get('weekday')
moment().get('isoWeekday')

获取小时

moment().hours()
moment().get('hours')

获取分钟

moment().minutes()
moment().get('minutes')

获取秒数

moment().seconds()
moment().get('seconds')

获取当前的年月日时分秒

moment().toArray() // [years, months, date, hours, minutes, seconds, milliseconds]
moment().toObject() // {years: xxxx, months: x, date: xx ...}

4.2 设置时间

设置年份

moment().year(2019)
moment().set('year', 2019)
moment().set({year: 2019})

设置月份

moment().month(11)  // (0~11, 0: January, 11: December)
moment().set('month', 11)

设置某个月中的某一天

moment().date(15)
moment().set('date', 15)

设置某个星期中的某一天

moment().weekday(0) // 设置日期为本周第一天（周日）
moment().isoWeekday(1) // 设置日期为本周周一
moment().set('weekday', 0)
moment().set('isoWeekday', 1)

设置小时

moment().hours(12)
moment().set('hours', 12)

设置分钟

moment().minutes(30)
moment().set('minutes', 30)

设置秒数

moment().seconds(30)
moment().set('seconds', 30)

年份+1

moment().add(1, 'years')
moment().add({years: 1})

月份+1

moment().add(1, 'months')

日期+1

moment().add(1, 'days')

星期+1

moment().add(1, 'weeks')

小时+1

moment().add(1, 'hours')

分钟+1

moment().add(1, 'minutes')

秒数+1

moment().add(1, 'seconds')

年份-1

moment().subtract(1, 'years')
moment().subtract({years: 1})

月份-1

moment().subtract(1, 'months')

日期-1

moment().subtract(1, 'days')

星期-1

moment().subtract(1, 'weeks')

小时-1

moment().subtract(1, 'hours')

分钟-1

moment().subtract(1, 'minutes')

秒数-1

moment().subtract(1, 'seconds')

4.3 格式化时间

格式代码	说明	返回值例子
M	数字表示的月份，没有前导零	1到12
MM	数字表示的月份，有前导零	01到12
MMM	三个字母缩写表示的月份	Jan到Dec
MMMM	月份，完整的文本格式	January到December
Q	季度	1到4
D	月份中的第几天，没有前导零	1到31
DD	月份中的第几天，有前导零	01到31
d	星期中的第几天，数字表示	0到6，0表示周日，6表示周六
ddd	三个字母表示星期中的第几天	Sun到Sat
dddd	星期几，完整的星期文本	从Sunday到Saturday
w	年份中的第几周	如42：表示第42周
YYYY	四位数字完整表示的年份	如：2014 或 2000
YY	两位数字表示的年份	如：14 或 98
A	大写的AM PM	AM PM
a	小写的am pm	am pm
HH	小时，24小时制，有前导零	00到23
H	小时，24小时制，无前导零	0到23
hh	小时，12小时制，有前导零	00到12
h	小时，12小时制，无前导零	0到12
m	没有前导零的分钟数	0到59
mm	有前导零的分钟数	00到59
s	没有前导零的秒数	1到59
ss	有前导零的描述	01到59
X	Unix时间戳	1411572969

格式化年月日： 'xxxx年xx月xx日'

moment().format('YYYY年MM月DD日')

格式化年月日： 'xxxx-xx-xx'

moment().format('YYYY-MM-DD')

格式化时分秒(24小时制)： 'xx时xx分xx秒'

moment().format('HH时mm分ss秒')

格式化时分秒(12小时制)：'xx:xx:xx am/pm'

moment().format('hh:mm:ss a')

格式化时间戳(以毫秒为单位)

moment().format('x') // 返回值为字符串类型

4.4 比较时间

获取两个日期之间的时间差

let start_date = moment().subtract(1, 'weeks')
let end_date = moment()

end_date.diff(start_date) // 返回毫秒数

end_date.diff(start_date, 'months') // 0
end_date.diff(start_date, 'weeks') // 1
end_date.diff(start_date, 'days') // 7
start_date.diff(end_date, 'days') // -7

4.5 转化为JavaScript原生Date对象

moment().toDate()
new Date(moment())

4.6 相对时间

moment("20111031", "YYYYMMDD").fromNow(); // 8 年前
moment("20120620", "YYYYMMDD").fromNow(); // 7 年前
moment().startOf('day').fromNow();        // 20 小时前
moment().endOf('day').fromNow();          // 4 小时内
moment().startOf('hour').fromNow();       // 1 小时前

4.7 日历时间

moment().subtract(10, 'days').calendar(); // 2019年5月14日
moment().subtract(6, 'days').calendar();  // 上周六晚上7点49
moment().subtract(3, 'days').calendar();  // 本周二晚上7点49
moment().subtract(1, 'days').calendar();  // 昨天晚上7点49分
moment().calendar();                      // 今天晚上7点49分
moment().add(1, 'days').calendar();       // 明天晚上7点49分
moment().add(3, 'days').calendar();       // 下周一晚上7点49
moment().add(10, 'days').calendar();      // 2019年6月3日

4.8 多语言支持

moment().format('L');    // 2019-05-24
moment().format('l');    // 2019-05-24
moment().format('LL');   // 2019年5月24日
moment().format('ll');   // 2019年5月24日
moment().format('LLL');  // 2019年5月24日晚上7点50分
moment().format('lll');  // 2019年5月24日晚上7点50分
moment().format('LLLL'); // 2019年5月24日星期五晚上7点50分
moment().format('llll'); // 2019年5月24日星期五晚上7点50分

4.9 实用技巧

moment().format("YYYY-MM-DD") // 格式化显示当前时间
`${moment().subtract("month", +1).format("YYYY-MM")}-01` // 上一个月的1号
`${moment().add("month", -1).format("YYYY-MM")}-01`  // 还是上一个月1号 
let M = `${moment().format("YYYY-MM")}-01` // 本月一号
moment(M).add("days", -1).format("YYYY-MM-DD") // 上一个月月底 
moment().startOf("year").format("YYYY-MM-DD")  // 本年的的开始日期，（"2019-01-01"）
moment().endOf("year").format("YYYY-MM-DD")  // 本年的的结束日期，（"2019-12-31"）
// moment 转成时间戳
moment().valueOf()
// 时间戳 转 moment
moment(string).format()

// 解决Moment格式化时间出现时区差的问题
// `utcOffset()` 接收数字，时间偏移量，单位：分钟
// 北京时间东八区时间，比零时区早8个小时（480分钟），所以应该加上480分钟
Moment(date).utcOffset(480).format('YYYY-MM-DD HH:mm:ss');

5、ant选择时间

在ant的a-range-picker组件的disabledDate使用

不能选择今天之前的日期（包括今天）

disabledDate(current) {
    return current && current < moment().endOf('day');
},

不能选择今天之前的日期（不包括今天）

disabledDate(current) {
   return current && current < moment().subtract(1, 'days').endOf('day')
},

点击选择的2019-01-01之前的数据无法确认

disabledDate(current) {
	return current  && current < moment('2019-01-01') 
},

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

moment.js

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

moment.js

作者已关闭评论

0 条评论

热度

Moment.js常见用法

Moment.js常见用法

1、安装Moment.js

2、引入Moment.js

3、设定moment区域为中国

4、使用方法

4.1 获取时间

4.2 设置时间

4.3 格式化时间

4.4 比较时间

4.5 转化为JavaScript原生Date对象

4.6 相对时间

4.7 日历时间

4.8 多语言支持

4.9 实用技巧

5、ant选择时间

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐