Fullcalendar v5 - 如何调用已经初始化和呈现的日历

Question

我有一个初始化的日历：

 $(document).ready(function(){
            
   var calendarEl = document.getElementById("calendar");
   var calendar = new FullCalendar.Calendar(calendarEl, {
       //options
   });
   calendar.render();
});

还有一个日期选择器，点击它会重定向到代码的不同部分：

$(function(){
    $("#datepicker").datepicker({
         //options
         onSelect: function(dateText) {
              resultado('mensaje', 'procesos.php?ac=10&v=D&fecha=' + dateText)
              },           
         });
     });

在那部分代码中，我曾经能够获取选择的日期并调用已经呈现的日历来更改其显示的日期和视图，如下所示：

var ndate = new Date(//date conversion);
    
    $('#calendar').fullCalendar('gotoDate', ndate);
    $('#calendar').fullCalendar('changeView', 'agendaDay');

升级到 v5 后，我似乎无法复制它。我已经阅读了 FullCalendar 中的每一页文档，并且尝试了不同版本但没有成功：

$('#calendar').calendar(function(){
     calendar.gotoDate(ndate);
     calendar.changeView(timeGridDay);
});

有谁知道如何替换 .fullCalendar 或对其他尝试有什么建议吗？非常感谢！

Answer 1

https://fullcalendar.io/docs/methods 展示了如何做到这一点。您获得使用 var calendar = new FullCalendar.Calendar... 初始化的日历实例，并可以在其上调用函数，就像任何 JS class 实例一样：

calendar.next();

当然，如果您需要在脚本的其他地方使用它，那么您需要确保 calendar 在您需要的地方是 in scope。如果您没有更复杂的 class 结构或任何其他会给您范围考虑的东西，那么在最简单的情况下，您可以将其设为全局，例如

var calendar; //global variable

$(function() {
  calendar = new FullCalendar.Calendar(calendarEl, {
    //options
  });

  calendar.render();
});

Fullcalendar v5 - 如何调用已经初始化和呈现的日历

Fullcalendar v5 - how to call already initialised and rendered calendar

javascript

scope

fullcalendar

fullcalendar-5