VueJS Calendar 來回一個月

Question

我已經構建了一個日歷，顯示日期和相應的日期表，我想添加函數以在月份之間進行更改。 我在這里提出的方法確實“有效”。 當我單擊具有此功能的按鈕時，它可以追溯到一個月前。 但只有一次，這是因為 selectedDate 沒有更新，所以當我嘗試使用我注釋掉的 console.log(selectedDate) 進行調試時，它仍然會打印今天的日期..希望有人能在這里幫助我

methods: {
  prevMonth() {
    var selectedDate = moment(new Date());
    let futureMonth = moment(selectedDate.subtract(1, 'month')).startOf('month')
        selectedDate = futureMonth;
    //return console.log(selectedDate)
    this.days = [...Array(futureMonth.daysInMonth())].map((_, i) => {
      return {
        date: futureMonth.clone().add(i, "day"),
        workhours: Math.floor(Math.random()*10),
        overtime: Math.floor(Math.random()*10),
        flextime: 0,
        sickness: 0,
        vacation: 0,
      }

    })
  }
}

Answer 1

每次運行此方法時，都將 selectedDate 設置為moment(new Date()) 。 所以它總是以今天為基礎回溯一個月。

您需要保持 selectedDate 的狀態，這樣的事情應該可以工作：

data() {
  return {
    selectedDate: undefined
  }
},
mounted() {
  this.selectedDate = moment(new Date())
},
methods: {
  prevMonth() {
    let futureMonth = moment(this.selectedDate.subtract(1, 'month')).startOf('month')
    this.selectedDate = futureMonth;
    ......
    })
  }
}