0
我最近升级到redux-form v6，并且我的material-ui自定义日期时间选择器停止工作。下面是它看起来像现在：DateTimePicker Redux窗体字段问题
class DateTimePicker extends React.Component {
handleDateChanged(e, value) {
let currentTime;
if (this.props.dateField.value) {
let currentValue = moment(this.props.dateField.value);
currentTime = currentValue.subtract(currentValue.clone().startOf('day'));
}
let newValue = moment(value).startOf('day').add(currentTime || 0);
this.props.dateField.onChange(newValue.toDate()); //this.refs.timePicker goes undefined when this line runs.
this.refs.timePicker.openDialog();
}
handleTimeChanged(e, value) {
return this.props.dateField.onChange(value); //This is called, but the value does not change.
}
formatDate(value) {
return moment.tz(value, this.props.timezone).format('M/D/YY HH:mm zz');
}
render() {
return (
<span>
<DatePicker
value={this.props.dateField.value || null}
autoOk={true}
maxDate={new Date()}
floatingLabelText="Change At"
floatingLabelStyle={{pointerEvents: 'none'}}
errorText={this.props.dateField.touched && this.props.dateField.error}
formatDate={this.formatDate.bind(this)}
onChange={this.handleDateChanged.bind(this)}
/>
<TimePicker
style={{display: 'none'}}
value={this.props.dateField.value || null}
format="24hr"
hintText="Time"
ref="timePicker"
onChange={this.handleTimeChanged.bind(this)}
/>
</span>
);
}
}
而且它的形式使用，像这样：
<Field
name="changeAt"
component={({input}) => {
return <DateTimePicker dateField={input} timezone={this.props.driver.homeTerminal.timezone} />
}}
/>
。
第一个问题：当我选择一天时，handleDateChanged被称为预期。当方法开始时，this.refs.timePicker按预期引用时间选择器。但是，执行上面的行时（this.props.dateField.onChange(newValue.toDate())），则引用将丢失，并且this.refs.timePicker将更改为undefined。
每个后续时间我选择一个日期，refs不会丢失，并且它可以正常工作。
第二个问题：当我选择一个时间时，handleTimeChanged被调用，其中调用this.props.dateField.onChange(value)具有正确的值;但是价值没有改变。
任何建议表示赞赏。