React FullCalendar - 在 fullcalendar 上显示附加数据

Question

我是使用反应和完整日历的新手，我有像这样的图像的页面。

然后，我有这样的事件列表：

    id: "9",
    eventId: "1",
    title: "Training Network",
    start: "2023-08-01T08:00:00",
    end: "2023-08-01T12:00:00",
    extendedProps: {
      department: "BioChemistry",
    },
  },
  {
    id: "10",
    eventId: "1",
    title: "Training Network",
    start: "2023-08-01T08:00:00",
    end: "2023-08-01T12:00:00",
    extendedProps: {
      organization: "DPR",
    },
  },

你知道如何将extendProp显示到上图中的页面中吗，因为我像下面这样声明了完整日历

<FullCalendar
            plugins={[
              dayGridPlugin,
              timeGridPlugin,
              interactionPlugin,
              listPlugin,
            ]}
            headerToolbar={{
              left: "prev,next",
              center: "title",
              right: "timeGridDay,listDay",
            }}
            initialView="timeGridDay"
            editable={true}
            selectable={true}
            selectMirror={true}
            dayMaxEvents={true}
            weekends={weekendsVisible}
            select={handleClickDate}
            initialEvents={INITIAL_EVENTS}
            initialDate={result}
            eventClick={handleEventClick}
            eventsSet={handleEvents}
          />

Answer 1

基于文档 将此道具添加到

<FullCalendar eventContent={renderEventContent} {..otherPorps} />

创建一个 renderEventContent 函数就可以满足要求

function renderEventContent(eventInfo) {
  return (
    <>
      <b>{eventInfo.extendedProps.organization}</b>
    </>
  );