Javascript 如何更改箭头单击的日期范围？[Nuxt]

我正在Vue中制定每周时间表，其中有一个条形图显示从周一到周日的范围，以及上一个箭头和下一个箭头。看起来是这样的：

Maj指五月和捷克-六月 在代码中，我有两种获取周一和周日的方法：

getMonday(date) {
  date = new Date(date);
  let day = date.getDay();
  let dayDifference = date.getDate() - day + (day == 0 ? -5 : 1);
  let d = new Date(date.setDate(dayDifference));
  let dayOfTheMonth = d.getDate();
  let month = this.months[d.getMonth()];

  let firstDay = {dayOfTheMonth, month};
  return  firstDay;
},
getSunday(date) {
  date = new Date(date);
  let day = date.getDay();
  let dayDifference = date.getDate() + day + (day == 0 ? +4 : 5);
  let d = new Date(date.setDate(dayDifference));
  let dayOfTheMonth = d.getDate();
  let month = this.months[d.getMonth()];

  let lastDay = {dayOfTheMonth, month};
  return lastDay;
},

我这样显示它们：

 <h1 id="currentWeek">{{ getMonday(new Date()).dayOfTheMonth }} {{ getMonday(new Date()).month }}
        - {{ getSunday(new Date()).dayOfTheMonth }} {{ getSunday(new Date()).month }}</h1>

---

我要说的是：不要搞乱日期，除非你真的想搞乱日期

有很多非常酷（但不是太大）的软件包可以简化这个主题，比如

这里有一个小片段来证明这一点：

newvue({
el:“应用程序”，
数据（）{
返回{
当前周：0，
}
},
安装的（）{
this.currentWeek=dayjs（）.week（）
},
计算：{
开始显示周（）{
return dayjs（）.week（this.currentWeek）.startOf（“week”）.format（“DD.MMMM”）
},
endDisplayedWeek（）{
return dayjs（）.week（this.currentWeek）.endOf（“week”）.format（“DD.MMMM”）
},
},
模板：`
当前周：{{currentWeek}}

`
})

.week步进器{
光标：指针；
}

dayjs.extend（window.dayjs_plugin_weekOfYear）

完全同意这一点。用于日期的库仍然是您可以找到的不太容易出错且经过战斗测试的解决方案。最重要的是要快速实施。放弃自制的解决方案，使用流行的解决方案。这或

日期fns

都是好的。

 prev(date) {
  this.getMonday(date - 6);
  this.getSunday(date - 6);
  console.log(this.getMonday(date - 6), this.getSunday(date - 6))
},
next(date) {
  this.getMonday(date + 6);
  this.getSunday(date + 6);
  console.log(this.getMonday(date + 6), this.getSunday(date + 6))
},`