Если значение не отображается, по умолчанию отображается дата - указатель даты - ReactJs

Question

Я нахожу выход с помощью react-datepicker, и все идет гладко, пока я не удаляю введенную дату ввода, она выдает мне ошибку: index.js:372 Uncaught RangeError: Invalid time value. Я понял, что это ошибка, потому что нет даты по умолчанию. Итак, мой вопрос, как я могу это исправить. Вот пример моего кода:

this.state= {
            startDate: moment().startOf('day').subtract(20, 'days'),
            endDate: moment().startOf('day').add(1,'days'),
}

   handleStartDate = date => {

        this.setState({
            startDate: moment(date).startOf('day')
        }, () => {
            if (moment(date).startOf('day').isAfter(this.state.endDate)) {
                this.setState({
                    endDate: moment(date).startOf('day').add(1,'days')
                })
            }
        });
    }

    handleEndDate = date => {
        this.setState({
            endDate: moment(date).startOf('day').add(1,'days')
        });
    };

...
 return (
      <DatePicker
          id='startDate'
          dateFormat="dd/MM/yyyy"
          defaultValue = {this.startDate}
          selected={this.state.startDate.toDate()}
          onChange={this.handleStartDate}
       />

      <DatePicker
          id='endDate'
          dateFormat="dd/MM/yyyy"
          minDate={this.state.startDate.toDate()}
          selected={this.state.endDate.toDate()}
          onChange={this.handleEndDate}
       />

)

Answer 1

На самом деле это не проблема значения по умолчанию, вам просто нужно проверить, содержит ли этот метод argument от onChange какие-то значения.

handleStartDate = date => {
  // When you delete the input value "date" will return null
  // So if no values, just do nothing
  if (!date) return

  //...

}

И то же самое относится к handleEndDate

---

Кроме того, если вы пытаетесь сделать какой-то сборщик дат Диапазон Я думаю, вы можете найти @ y0c / Reaction-DatePicker более полезно. Вот пример codeSandbox