FullCalendar v5 - 在 React 中更新完整事件列表的最佳方式？

让我们考虑以下场景 -

• 我们有一个用于部门列表的下拉/选择组件（在 FullCalendar 之外） -Department 1, Department 2 etc.
• 每个部门都有自己的活动列表（department1Events例如下面），我们需要在日历中渲染它。
• 每次用户选择一个新部门时，我们都需要获取相应的事件列表。对于我们使用的事件，这种事件获取不需要使用 FullCalendar 基于函数的方法successCallback等等。假设我们试图避免使用基于函数的方法，而只想使用基于 JSON 的方法。我们将在 FullCalendar 之外自行获取此事件列表。

因此，主要是，我需要更新每次用户选择一个部门或在它们之间切换时日历呈现的事件列表。鉴于此，删除所有事件然后添加到事件源（如下所示）是一个好方法吗？

            //events list
            const department1Events = [
               {
                 id:1,
                 title: 'dept 1 event 1',
                 color: 'red'
               },
               {
                 id:2,
                 title: 'dept 1 event 2',
                 color: 'green'
               }
            ];
            
            const department2Events = [
               {
                 id:111,
                 title: 'dept 2 event 1',
                 color: 'yellow'
               },
               {
                 id:2222,
                 title: 'dept 2 event 2',
                 color: 'orange'
               }
            ]
            
            //maintaining the events list on the component state
            const [eventsList, setEventsList] = useState(department1Events);

            //component to switch between departments
            <SelectComponent
              label="Department"
              options={[
                  {id:'department 1', value:'department1'},
                  {id:'department 2', value:'department2'}
              ]}
              onChange={(value) => handleDepartmentChange(value)}
            />

            //handler for department change
            const handleDepartmentChange = (department) => {
              const myCalendar = calendarRef?.current?.getApi();
              myCalendar?.removeAllEvents();
              myCalendar?.addEventSource(department);
              setEventsList(value);
            };
            
            //calendar component
            <FullCalendar
               ref={calendarRef}
               headerToolbar={false}
               plugins={[dayGridPlugin, timeGridPlugin]}
               initialView="timeGridDay"
               initialEvents={eventsList}
             />;

我认为这种方法的删除是必要的，因为否则它会将第二个事件列表附加到第一个事件列表中，导致第一个部门显示两个部门的事件，这是不正确的。我必须删除事件然后添加到源的方式似乎有点不确定。有没有一种更干净的方法（也许是我缺少的一组方法？）来解决这个问题handleDepartmentChange使用 API 的方法？