javascript - 在 FullCalendar 中进行 Ajax 调用后为假期着色

Question

我正在与 http://fullcalendar.io/ 合作。我的目的是为假期赋予不同的背景颜色。经过大量搜索后，我可以说一个好的解决方案是使用 dayRender 钩子(Hook)。但是如何获取假期列表以及时间安排呢？

解决方案 1:每天进行一次 Ajax 调用。

dayRender: function (date, cell) {
    $.ajax({
        url: '/myproject/holidays?date='+date,
        type: "POST",
        success: function(isHoliday) {
            if (isHoliday) {
                cell.css("background-color", "red");
            }
        }
    });
}

它应该可以工作，但是......每天都有一个 Ajax 调用？这似乎不是一个很好的解决方案..

解决方案 2:一次 ajax 调用即可获取所有假期

dayRender: function (date, cell) {
    if ($.inArray(date, holidayList)) {
        cell.css("background-color", "red");
    }
}

之前在某个地方获取了“holidayList”。 这是我的问题。在什么时候之前？ 我如何确定在调用每天的 dayRender 之前已完成获取 HolidayList？换句话说:有一个我可以依靠的钩子(Hook)来获取假期列表吗？

谢谢

Answer 1

我在这里看到两个选项:

1. 仅在假期获取 Ajax 请求完成后初始化整个日历(同时显示加载器/旋转器)。简单，但不“漂亮”。

2. 假期获取 Ajax 请求完成后，立即刷新整个日历 View 。由于内部 reinitView 方法无法导出以供外部调用，因此您必须再执行几个步骤:

   var fcEl = $('#calendar'),
       view = fcEl.fullCalendar('getView');
   view.unrenderDates();
   view.renderDates();
   fcEl.fullCalendar('refetchEvents');