首页 > 解决方案 > FullCalendar,在 selectOverlap 回调中获取当前日期?

问题描述

我正在使用 FullCalendar 5 和interactionPluginin React。我希望允许用户选择没有事件的任何日期以及事件结束的任何日期。因此,如果有一个从 4 月 1 日到 3 日的活动,我希望能够选择 3 日、4 日、5 日等,但不能选择 2 日。那有意义吗?

我正在使用selectOverlap它,当用户将鼠标拖到事件上时它会触发。我能够获取事件的开始日期和结束日期,但不能获取用户选择的日期范围。有没有办法获取用户在selectOverlap回调中选择的日期范围?如果没有,我可以使用另一个回调来获取鼠标当前结束的日期吗?

<FullCalendar
    ref={calendarRef}
    timeZone={timezone}
    plugins={[dayGridPlugin, interactionPlugin, momentTimezonePlugin]}
    selectOverlap={handleSelectOverlap}
    ...
/>

const handleSelectOverlap = (event) => {
    console.log("end", event.end);
    // I have the event's end date but how do I get the current date the mouse is over?
    return false;
};

标签: fullcalendarfullcalendar-5

解决方案


我认为你不能通过 selectOverlap 做到这一点——它只允许一个简单的是/否来判断它是否重叠,它不能告诉你它在哪里重叠。

我认为您必须使用https://fullcalendar.io/docs/selectAllow进行自己的验证- 它为您提供用户刚刚选择的范围的开始和结束日期 - 和https://fullcalendar.io/ docs/Calendar-getEvents - 获取当前日历上的所有事件 - 然后自己检查每个事件的选择。


推荐阅读