FullCalendar 限制显示指定有效时间范围区域

5 min read

FullCalendar 限制显示指定有效时间范围区域

https://fullcalendar.io/docs/validRange

该validRange属性可以具有start和end属性。您可以指定一个而不指定另一个以创建一个开放式范围。

// constrain to a discrete range
var calendar = new Calendar(calendarEl, {
  initialView: 'dayGridMonth',
  validRange: {
    start: '2017-05-01',
    end: '2017-06-01'
  }
});

// constrain to an open-ended range
var calendar = new Calendar(calendarEl, {
  initialView: 'dayGridMonth',
  validRange: {
    start: '2017-05-01'
  }
});

您还可以通过函数动态生成范围。它必须以相同的格式返回一个对象:

var calendar = new Calendar(calendarEl, {
  initialView: 'dayGridMonth',
  validRange: function(nowDate) {
    return {
      start: nowDate,
      end: nowDate.clone().add(1, 'months')
    };
  }
});

此函数接收日历的“现在”日期(也称为“今天”日期),这对于将导航和事件限制在未来的某个时间窗口非常有用。