moment.js踩的周选择坑

moment.js是一个强大的JavaScript日期处理类库,加上antd与moment.js的强耦合,必须用。

故事的开始要从前段时间做的一个需求的其中一个功能:

用户可选择默认周期为“下周(下周一~下周日)”,支持当前周往后再选4周(W+1 ~ W+4)

当时的实现四周日期如下:

1
2
3
4
5
6
7
8
9
setWeekList(howMuch = 1) {
if (howMuch === 0) return;
const item = {
start: moment().day('Monday').add(7 * howMuch, 'd').format('YYYY-MM-DD'),
end: moment().day('Monday').add((7 * howMuch) + 6, 'd').format('YYYY-MM-DD'),
};
this.weekList.unshift({ ...item });
this.setWeekList(howMuch - 1);
}

正常工作日使用是没有问题的,但周日选择会出现问题:
我们日常认为的周起始是周一,但moment.js中默认为周日。。。导致周日时取的下周为下下周==。

正确姿势:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
setWeekList(howMuch = 1) {
if (howMuch === 0) return;
/**
* WARNING:
* `moment().startOf('isoWeek');` set to the first day (Monday) of this week according to ISO 8601, 12:00 am
* `moment().day('Monday')` default first day --- Sunday
* doc: https://momentjs.com/docs/#/manipulating/start-of/
*/
const item = {
start: moment()
.startOf('isoWeek')
.add(7 * howMuch, 'd')
.format('YYYY-MM-DD'),
end: moment()
.startOf('isoWeek')
.add((7 * howMuch) + 6, 'd')
.format('YYYY-MM-DD'),
};
this.weekList.unshift({ ...item });
this.setWeekList(howMuch - 1);
}
© 2019 lvbin's Blog All Rights Reserved.
Theme by hiero