完整日历 - React - 如何在月视图中禁用拖动事件

Question

我目前正在使用 React Full Calendar 作为预订系统，我想在日历的月视图中禁用拖动。

我之前看过 post 如何做到这一点，但这是使用 jQuery，而不是 React，因此我仍然卡住了。

这是我当前的日历：

我怎么可能在 React Full Calendar 中做到这一点？

谢谢。

<FullCalendar
        plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
        headerToolbar={{
          left: "prev,next today",
          center: "title",
          right: "dayGridMonth,timeGridWeek,timeGridDay",
        }}
        height="auto"
        initialView="timeGridWeek"
        editable={true}
        eventColor="#6DCBCA"
        selectable={bookingLesson} // Allows a user to highlight multiple days or timeslots by clicking and dragging.
        selectMirror={true}
        dayMaxEvents={true}
        allDaySlot={true}
        weekends={true}
        events={currentEvents}
        select={handleDateSelect}
        eventContent={renderEventContent}
        eventClick={handleEventClick}
        eventDrop={handleEventDrop}
        eventDragStart={handleEventDragStart}
        eventDragStop={handleEventDragStop}
        eventConstraint={"lesson-available"}
        selectConstraint={"lesson-available"}
        selectOverlap={(event) => {
          return !(event.groupId == "lesson-unavailable");
        }}
        slotDuration="00:60:00"
        slotMinTime="6:00:00"
        slotMaxTime="22:00:00"
      />

Answer 1

我认为视图名称的三元组可以解决问题

selectable={viewName === "dayGridMonth" ? false : true}

您可以使用 FullCalendarRef 获取 viewName API

完整日历 - React - 如何在月视图中禁用拖动事件

Full Calendar - React - How to Disable Dragging Events on Monthly View

fullcalendar

reactjs