Создайте пользовательский компонентный компонент для выбора дня реакции

Question

Я создавал пользовательский компонент пользовательского интерфейса для DayPickerInput, но проблема в том, что при запуске onDayChange возникает ошибка.

handleToDateChange = (selectedDay, modifiers, dayPickerInput) => {
    const val = dayPickerInput.getInput().value;
}

Uncaught TypeError: Cannot read property 'value' of null

Компонент DayPickerInput

 <DayPickerInput
      component={props => <DatePickerCustomInput {...props} />}
      value={toDate}
      placeholder=""
      formatDate={this.setDatePickerformatDate}
      onDayChange={this.handleToDateChange}
  />

Пользовательский компонент DayPickerInput

class DatePickerCustomInput extends Component {
   render() {
       return (
           <TextField {...this.props}
               InputProps={{
                   startAdornment: (
                       <InputAdornment position="start">
                           <DateRange />
                       </InputAdornment>
                   ),
               }}

               value={this.props.value}
           />
       );
   }
}

для воспроизведения проблемы: https://codesandbox.io/s/387r9plx65

Answer 1

Попробуйте сделать это!

handleToDateChange = (selectedDay, modifiers, dayPickerInput) => {
    const val = dayPickerInput.state.value;
}