Javascript 将react-datepicker与redux表单一起使用

我正在尝试将react datepicker与redux表单一起使用，我面临一个问题。从日期选择器中选择日期时，出现以下错误：

Uncaught TypeError: t.isSame is not a function

我的代码如下：

// My component that uses the date picker
const renderDateField = (field) => {
  return (
    <div>
      <img src={require('./images/date.png')} className={styles.iconField} />
      <DatePicker {...field.input} placeholderText={field.placeholder} onChange={field.onDateChange} dateFormat='DD/MM/YYYY' selected={field.selected ? field.selected : null} className={styles.inputField} />
    </div>
  );
};

export class MyComponent extends React.Component {

  constructor (props) {
    super(props);
    this.state = {
      startDate: moment()
    };
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange (date) {
    console.log('handle Change', date);
    this.setState({
      startDate: date.format('DD/MM/YYYY')
    });
  }

  render () {
    const { handleSubmit } = this.props;
    console.log('Render global state.startDate', this.state.startDate);
    return (
      <div>
        <form onSubmit={handleSubmit(this.props.filterSubmit)} method='post' action='/tennis/search'>
                ...
                <Field name='date' placeholder='Quand ?' component={renderDateField} onDateChange={this.handleChange} selected={this.state.startDate} />
                ...
        </form>
      </div>)
    ;
  }
}
...
TennisSearchFilters.propTypes = {
  filters: React.PropTypes.shape({
    date: React.PropTypes.object
  }),
  filterSubmit: React.PropTypes.func.isRequired,
  handleSubmit: propTypes.handleSubmit
};
    ...
export default reduxForm({
          form: 'tennisSearch',
          validate: validateTennisSearchForm
        })(TennisSearchFilters);

//使用日期选择器的我的组件
常量renderDateField=（字段）=>{
返回(
);
};
导出类MyComponent扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
开始日期：时刻（）
};
this.handleChange=this.handleChange.bind（this）；
}
手册更改（日期）{
console.log（'处理更改'，日期）；
这是我的国家({
startDate:date.format（'DD/MM/YYYY'）
});
}
渲染（）{
const{handleSubmit}=this.props；
log（'Render global state.startDate'，this.state.startDate）；
返回(
...
...
)
;
}
}
...
TennisSearchFilters.propTypes={
过滤器：React.PropTypes.shape({
日期：React.PropTypes.object
}),
过滤器提交：需要React.PropTypes.func，
handleSubmit:propTypes.handleSubmit
};
...
导出默认reduxForm({
表格：'tennisSearch'，
验证：ValidateAnnissearchForm
})（田纳西过滤网）；

我认为存在一个格式错误，因为输入值似乎被更新为字符串，然后在将某个时刻与字符串进行比较时崩溃。但我不太确定。。。因此，我请求您的帮助：）

我检查了其他帖子和问题，但它没有正常工作（也许我做错了什么）

---

非常感谢你的帮助

查看提供的代码示例，我假设

react datepicker

正在引擎盖下使用

moment

onChange

方法接收

moment

实例，您正在将该实例转换为普通字符串。然后，

react-datepicker

尝试对字符串值调用

isname

方法，这当然会失败

不是将更新后的值转换为字符串，而是按接收状态存储

this.setState({
    startDate: date,
});

---

在日历组件中尝试：：

 onChange ={val => {
   field.onDateChange // Rather read the value from redux-form
   return field.input.onChange(val) // This should dispatch the value to redux-form
  }
}

---

不确定使用redux表单时为什么要在此处设置其他视图状态？

是，覆盖已在

字段中的
onChange
。input

是一个错误。因为我假设它是一个内部组件状态，我不希望它成为表单验证的一部分。这就是为什么我想离开redux商店：）我猜当写redux表单的人认为这不是一个好主意，这不是一个好主意：）如果是这样的话，就不要把它包括在你的验证中。就这么简单。我很确定我以前已经测试过了，但无论如何，这解决了我的问题。我是一个初学者，我仍然需要正确理解传递给每个函数的内容和时间：）再次感谢；）