需要帮助使事件在单击时执行某些操作，而其他事件在单击时不执行任何操作

Question

<FullCalendar
                    allDaySlot={true}
                    eventClick={(info) => this.openReservationInfoModal(info.event)}
                    events={[...milestones.map(milestone => ({
                        id: milestone.id,
                        title: milestone.description,
                        start: milestone.expectedDate,
                        allDay: true
                    })), ...this.state.reservations]}

此代码的作用是在日历中显示里程碑和房间预订，但我的问题是，在日历中，当我单击预订的房间时，它会显示谁预订了房间以及预订房间的原因，只是因为此代码：

eventClick={(info) => this.openReservationInfoModal(info.event)}

这就是它应该做的；但是当我单击日历上的里程碑时，它显示的内容与单击预订房间时显示的内容相同，我想要的是更改代码，以便当我单击日历上的里程碑时，它不会显示任何内容，就好像它是

eventClick={null} 

但是当我点击预订房间时，它仍然显示谁预订了房间以及预订房间的原因，基本上我想将预订事件点击与里程碑事件点击分开。

我问chatgpt，它这样做了：

<FullCalendar
  allDaySlot={true}
  eventClick={(info) => this.handleEventClick(info.event)}
  events={[...milestones.map(milestone => ({
    id: milestone.id,
    title: milestone.description,
    start: milestone.expectedDate,
    allDay: true,
    type: 'milestone' // Add a type property to differentiate milestones
  })), ...this.state.reservations]}
/>

// Event click handler
handleEventClick(event) {
  if (event.extendedProps && event.extendedProps.type === 'milestone') {
    // Handle click for milestones (do nothing or show a different modal)
    // For example, you can add a specific action or leave it empty
    console.log('Milestone clicked');
  } else {
    // Handle click for reservations
    this.openReservationInfoModal(event);
  }
}

// Method to open reservation info modal
openReservationInfoModal(reservation) {
  // Add your logic to show reservation information
  console.log('Reservation clicked', reservation);
  // Display the modal with reservation information
}

但还是没成功

Answer 1

答案：

<FullCalendar
  allDaySlot={true}
  eventClick={(info) => this.handleEventClick(info)}
  events={[...milestones.map(milestone => ({
    id: milestone.id,
    title: milestone.description,
    start: milestone.expectedDate,
    allDay: true,
    type: 'milestone',
  })), ...this.state.reservations]}
/>

// ...

handleEventClick(info) {
  const { event } = info;

  if (event.extendedProps && event.extendedProps.type === 'milestone') {
    // Clicked on a milestone, do nothing or add your custom behavior
    console.log('Clicked on a milestone');
  } else if (event.type !== 'milestone') {
    // Clicked on a reservation, open the reservation info modal
    this.openReservationInfoModal(event);
  }
}