我将Datepicker组件用于日历,以使用用户选择的日期更新状态。
当我尝试使用输入React更改默认日期时,输出错误:“ TypeError:e.target未定义”。
谢谢。
状态:
this.handleSubmit = this.handleSubmit.bind(this);
this.handleDate = this.handleDate.bind(this);
this.handleGuests = this.handleGuests.bind(this);
this.handleName = this.handleName.bind(this);
this.state = {
min: new Date().getHours,
max: new Date(),
booking: {
date: new Date(),
people: 1,
name: 'John Doe',
},
}
handleDate函数:
handleDate(e){
const booking = {...this.state.booking}
booking.date = e.target.value;
this.setState({booking});
}
日期选择器:
<DatePicker
name="Datepicker"
className="form-control mx-auto form-control-lg p-3"
selected={this.state.booking.date}
onChange={this.handleDate}
showTimeSelect
timeFormat="HH:mm"
timeIntervals={60}
dateFormat="MMMM dd, yyyy h:mm aa"
timeCaption="Time"
placeholderText="Click and choose the date"
/>
答案 0 :(得分:0)
来自自述文件的日期选择器组件:
https://github.com/Hacker0x01/reactdatepicker/blob/master/README.md#installation
回调不使用事件,它已经在handleChange函数的参数中包含date对象。
handleChange(date) {
this.setState({
startDate: date
});
}
render() {
return (
<DatePicker
selected={this.state.startDate}
onChange={this.handleChange}
/>
);
}