如何在datepicker / calendar中包含过去一周的日期？

Question

我尝试使用标题格式创建一个日期选择器，其日期缩写为与日期编号匹配。

本月有31天，有31天打印出来，但是12月1日上周五开始，我希望能够显示过去一周的日子或者只是显示这个数字1指的是12月1日开始在当天迭代，在这种情况下1应该在F下，如下图所示：

以下是我提出的代码：

var currentMonthDays = [];
var monthDays = dateFns.eachDay(dateFns.startOfMonth(new Date()), dateFns.lastDayOfMonth(new Date()));

for(var day in monthDays){
  currentMonthDays.push(dateFns.format(monthDays[day], 'D'));
}

var numbers = document.querySelector('.picker-days');
for(var key in currentMonthDays){
  var htmlString = '<span class="picker-daysNumber">' + currentMonthDays[key] + '</span>';
    numbers.insertAdjacentHTML('beforeend', htmlString);
}

https://jsfiddle.net/cw5oyurp/3/

Answer 1

我不确定它是否有问题，我还要进一步检查，但这是我能够解决问题的方法。

首先，我得到了12月第一周的日期，然后检查了第一周第一天和第一天之间的天数差异。

12月第一周的第一天是星期日26日开始的。 十二月一日是星期五。

天数的差异是5天，所以我只是将空值推送到currentMonthDays数组，到目前为止它还在工作。也许我会得到日期号码。

// organize the days in the calendar to be under the correct day abbreviation
var firstDayOfTheMonth = new Date(this.currentMonthDays.original[0]);
var monthWeekStartedOn = startOfWeek(new Date(this.currentMonthDays.original[0]));
var dayDiff = differenceInDays(firstDayOfTheMonth, monthWeekStartedOn);
for(var i = 0; i < dayDiff; i++){
    this.currentMonthDays.formatted.unshift(' ')[i];
}

console.log(this.currentMonthDays);