在 fullcalendar.io 上重新渲染删除所有事件

Question

我不知道如何处理 fullcalender.io。 因为我将刷新日历，所以我想我会像这样返回日历对象。

var calendar = function (eventsObj) {
    console.log(eventsObj);
    return new FullCalendar.Calendar(document.getElementById("calendar"), {
        plugins: ['interaction', 'dayGrid', 'timeGrid'],
        defaultView: 'dayGridMonth',
        defaultDate: new Date().getDate(),
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay'
        },
        events: eventsObj
    });
}

我这样做是因为我需要在引导模式中刷新所有事件。 当显示 Modal 时，我记得这个功能。

 $("#assignModal").on("shown.bs.modal", function () {
            calendar(globalEvents).rerenderEvents();

这里globalEvents是一个包含所有事件的数组。 我最初像这样渲染日历

window.onload = function () {
    calendar(globalEvents).render();
};

问题是日历呈现但它没有任何事件，而如果我只呈现日历，它会保留所有事件。 我查看了他们的文档，他们在不同版本中具有不同的功能。 有任何想法吗？ 请？

Answer 1

所以基本上根据 v4 指南。

calendar.getEventSources().forEach(function (item) {
                item.remove();
            });
            calendar.addEventSource(globalEvents);

这就是您必须删除事件并呈现新事件的方式。 这里globalEvents只是我用来跟踪刷新事件的数组。

Answer 2

您可以执行以下操作，只需删除旧事件附加新事件和重新渲染事件

下面是一些可以帮助你的 APIS

//remove old data
$('#fullCalendar').fullCalendar('removeEvents');

//Getting new event json data
$("#fullCalendar").fullCalendar('addEventSource', response);

//Updating new events
$('#fullCalendar').fullCalendar('rerenderEvents');

//getting latest Events
$('#fullCalendar').fullCalendar( 'refetchEvents' );

//getting latest Resources
$('#fullCalendar').fullCalendar( 'refetchResources' );

这是工作示例