Vuetify v-calendar @change start end and days 不包括过去或下个月的天数

问题描述

我正在尝试使用 vuetify 创建 v-calendar。 问题是当我使用 @change 事件时，它不包括像 fullcalendar 一样在 crud 上查看的日期范围。我怎样才能得到那些日子？

<v-calendar
 ref="calendar"
 v-model="focus" 
 :events="events" 
 @change="updaterange"
></v-calendar>

方法

updaterange ({ start,end }) {
    // start.date and end.date gives first/end day of the month instate of range of crud
    this.events = this.getEvents(start.date,end.date)
)}

解决方法

我也在另一个问题上回答过这个问题，但我也会在这里回答。

如果您在每月视图中，则 VCalendarMonthly/Weekly 组件上有一个“天”计算属性，它使用一些方法来计算开始和结束日期。

您可以通过日历引用访问这些基本方法以获取开始/结束日期。

您的方法将如下所示：

updateRange ({ start,end }) {
    viewStart = this.$refs.calendar.getStartOfWeek(start);
    viewEnd = this.$refs.calendar.getEndOfWeek(end);
    
    this.events = this.getEvents(viewStart.date,viewEnd.date);
)}