javascript - 如何在 React Big Calendar 中获取选定的事件？

Question

<BigCalendar
    events={dummyEvents}
    onSelectEvent={event => alert(event)}
    eventPropGetter={eventStyleGetter}
/>

在 上显示事件后BigCalendar，我想知道选择了哪个事件。但是这个片段只显示一个空字符串？

如何在 React Big Calendar 中获取选定的事件？

Answer 1

You're trying to alert() an object. The onSelectEvent method gets the full event you clicked on {start, end, allDay, ...rest}, where start and end should both be true JS Date objects. And, since you included onSelectEvent you must now control selected on your calendar.

const [selected, setSelected] = useState();

const handleSelected = (event) => {
  setSelected(event);
  console.info('[handleSelected - event]', event);
};
<Calendar
  selected={selected}
  onSelectEvent={handleSelected}
  {...otherProps}
/>

Important Note: selected must be a reference to an object in your events array. The event, sent to onSelectEvent is a reference, not a copy. If you change your state value later, without updating your events array, then RBC won't show those changes.