Состояние ввода React Datepicker не меняется?

У меня есть многошаговая форма с дочерними компонентами формы. На одном из компонентов я пытаюсь внедрить YouCanBookMe DatePicker.

Теперь, когда я пытаюсь обновить состояние значения DatePicker, как я делаю с другими обычными текстовыми вводами, состояние не обновляется. Если я набрал дату, состояние обновляется, но не тогда, когда я на самом деле выбираю дату из средства выбора. Я действительно не знаю, почему. Кто-нибудь из вас может указать, почему это не так?

Ваша помощь очень ценится. Я новичок в React, и я пробовал 3 разные библиотеки Datepicker, и постепенно схожу с ума, потому что ни одна из них не работает или я не могу преобразовать ее в структуру Parent-Child. Спасибо!

родитель:

 constructor(props) {
    super(props);

    this.state = {
      wants_interview_date: moment().format("DD-MM-YYYY")
   }
  }
  
 handleChange(field) {
    return (evt) => this.setState({ [field]: evt.target.value });
 }
 
 render(){
    return <FormStep8
        wants_interview_date={this.state.wants_interview_date}
        onDateChange={this.handleChange('wants_interview_date')} />;
 }

Дочерний компонент:

render() {
  <Datetime
    timeFormat={false}
    dateFormat="DD-MM-YYYY"
    inputProps={{id: 'wants_interview_date', onBlur: this.props.onDateChange, value: this.props.wants_interview_date}} //To get the regular HTML input props
  />
}

Источник

2 ответа

Хорошие друзья в Reactiflux помогли мне решить проблему. По-видимому Moment.js возвращал объект на handleChange и поэтому государство ничего не показывало. Выходные данные, необходимые для использования _d Moment.js метод. Вот правильный handleChange метод:

handleDateChange(field) {
    return evt => {
      const value = evt._d;
      this.setState({ wants_interview_date: value });
    };
  }
Источник

У меня нормально работает этот фрагмент кода, импорт DateTime (заглавная T)

import DateTime from 'react-datetime'; 

<DateTime name="newapp_time" 
onChange={(e) => { this.setState({ newapp_time: moment(e).toJSON() }) }} />

результатом является отметка времени в этом случае

Источник
Другие вопросы по тегам