Полный календарь в React TypeError: Невозможно прочитать свойство 'calendar' из неопределенного

Question

Я получаю сообщение об ошибке при попытке сохранить информацию о выбранном времени в состоянии. Любая помощь приветствуется, спасибо за ваше время! Пожалуйста, дайте мне знать, если вам, ребята, нужна дополнительная информация c.

Ниже приведен фрагмент кода из моего компонента:

  const Calendar = (props) => {

  const [startTime, setStartTime] = React.useState('');

  const handleSelect = (selectedInfo) => {
    //alert(selectedInfo.startStr);
    setStartTime(selectedInfo.startStr);
  }

  return (
    <FullCalendar 
      defaultView="timeGridWeek" 
      weekends={false} 
      allDaySlot={false}
      plugins={[ timeGridPlugin, dayGridPlugin, interactionPlugin ]} 
      minTime="08:00:00"
      selectable={true}
      selectMirror={true}
      selectOverlap={false}
      select={handleSelect}
      header={{
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,timeGridDay'
      }}
      events={[
        { title: 'event 1', start: '2020-03-16 10:00:00', end: '2020-03-16 12:00:00' },
        { title: 'event 2', start: '2020-03-19' }
      ]}
    />
  );
}

Answer 1

export default class Calendar extends React.Component{
    state = {startTime: ''}

    handleSelect = (selectedInfo) => {
        //alert(selectedInfo.startStr)
        this.setState({ startTime: selectedInfo.startStr})
        console.log("working!!", this.state.startTime)
    }

    render(){
        return (
            <FullCalendar
                defaultView="dayGridMonth"
                weekends={false}
                allDaySlot={false}
                plugins={[timeGridPlugin, dayGridPlugin, interactionPlugin]}
                minTime="08:00:00"
                selectable={true}
                selectMirror={true}
                selectOverlap={false}
                select={this.handleSelect}
                header={{
                    left: 'prev,next today',
                    center: 'title',
                    right: 'dayGridMonth,timeGridWeek,timeGridDay'
                }}
                events={[
                    { title: 'event 1', start: '2020-03-16 10:00:00', end: '2020-03-16 12:00:00' },
                    { title: 'event 2', start: '2020-03-19' }
                ]}
            />
        )
    }
}

У меня тоже была такая же проблема. То же сообщение об ошибке. Я искал inte rnet, и я нашел следующее решение: