Не могу сбросить состояние компонента в React

Я пытаюсь сбросить значение даты / текст внутри реагирующего средства выбора даты, когда пользователь вводит недопустимую дату. Вот код:

class Test extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      date: Date.now()
    };
  }

  render() {
    return (
      <DatePicker
        name="date"
        selected={this.state.date && moment(this.state.date, "x")}
        onChange={date => {
          this.setState({
            date: date.valueOf()
          });
        }}
        onBlur={e => {
          let date = moment(e.target.value, "LLL", true);
          if (date.isValid()) {
            this.setState({
              date: date.valueOf() // apply good value
            });
          } else {
            this.forceUpdate();
          }
        }}
        showTimeSelect
        timeFormat="HH:mm"
        timeIntervals={30}
        dateFormat="LLL"
        timeCaption="Time"
        minDate={moment().add(30, "minutes")}
      />
    );
  }
}

Я пытался поместить его в JSFiddle, но, похоже, у него проблемы с рендерингом компонента response-datepicker, но этот компонент прекрасно отрисовывается в моем собственном коде.

Кажется, проблема в том, что forceUpdate не вызывает сброса компонента. Мне интересно, происходит ли сброс только для самого выбора календаря, а не для поля ввода (что я и пытаюсь сделать). Я пытался добавить value свойство и установка его на то же самое, что и selected собственность, но это не имеет никакого эффекта. Проверка запускается и работает, как и ожидалось, но повторное отображение текста в поле ввода не выполняется.

1 ответ

Нет необходимости форсировать обновление компонента, если состояние не изменилось, и, если состояние изменится, представление все равно будет снова отображено. Принудительное выполнение таких обновлений не приведет к изменениям рендера. Обычно при форматировании дат с моментом я сначала проверяю, что необработанные данные пригодны для преобразования в дату, затем я конвертирую их, и мне никогда не нужно было проверять их снова.

Другие вопросы по тегам