输入框未填入所选日期

Question

我正在使用 airbnb 的 react-dates 库作为日期选择器。但是，它现在可以与 redux 形式一起使用。当我点击 select 日期按钮时，日历弹出。 select 输入日期时，输入框显示为空，而不是 select 输入日期。

My problem is the selected date is not shown on the input box.

这是我的代码

const renderDateRangePicker = ({
  input,
  focused,
  onFocusChange,
}) => (
  <SingleDatePicker
    id="date_input"
    onDateChange={(value) => input.onChange(value.date)}
    onFocusChange={onFocusChange}
    focused={focused}
    date={(input.value && input.value.date) || null}
    className="form-control"
  />
);

onFocusChange({ focused }) {
  this.setState({ focused });
}

const { focused } = this.state;

<Field
  name="Fecha"
  onFocusChange={this.onFocusChange}
  focused={focused}
  component={renderDateRangePicker}
/>

如何在输入框中显示 selected 日期，同时 selected 日期也被保留？

Answer 1

更改您的 onDateChange 函数和日期属性如下：

onDateChange={(value) => input.onChange(value)} 
date = {input.value || null}

这应该可以解决您的问题。

输入框未填入所选日期

input box not filled with the selected date

javascript

ecmascript-6

reactjs

redux-form