我需要在1页上发布2个DateRangePicker,但是我的代码无法正常工作。 startDate和endDate变量之间可能存在一些冲突。尽管我使用其他变量,但错误不会消失。请帮助解决问题。这是我的代码:
constructor(props) {
super(props);
moment.locale('ru');
this.state = {
startDate: null,
endDate: null,
startDate2: null,
endDate2: null,
focusedInput: null,
focusedInput2: null,
};
}
render() {
return (
<div>
<DateRangePicker
startDate={this.state.startDate}
endDate={this.state.endDate}
onDatesChange={({startDate, endDate}) => this.setState({
startDate,
endDate
})}
focusedInput={this.state.focusedInput}
onFocusChange={(focusedInput) => this.setState({focusedInput})}
readOnly={true}
hideKeyboardShortcutsPanel={true}
showClearDates={true}
startDateId="startDate"
endDateId="endDate"
isOutsideRange={() => false}
/>
<DateRangePicker
startDate={this.state.startDate2}
endDate={this.state.endDate2}
onDatesChange={({startDate2, endDate2}) => this.setState({
startDate2,
endDate2
})}
focusedInput={this.state.focusedInput2}
onFocusChange={(focusedInput2) => this.setState({focusedInput2})}
readOnly={true}
hideKeyboardShortcutsPanel={true}
showClearDates={true}
startDateId="startDate2"
endDateId="endDate2"
isOutsideRange={() => false}
/>
</div>
);
}
}
<DateRangePicker
startDate={this.state.startDate}
endDate={this.state.endDate}
onDatesChange={({startDate,endDate}) =>
this.setState({
startDate:startDate,
endDate:endDate
})
}
focusedInput={this.state.focusedInput}
onFocusChange={focusedInput => this.setState({ focusedInput })}
readOnly={true}
hideKeyboardShortcutsPanel={true}
showClearDates={true}
startDateId="startDate"
endDateId="endDate"
isOutsideRange={() => false}
/>
<DateRangePicker
startDate={this.state.startDate2}
endDate={this.state.endDate2}
onDatesChange={({startDate,endDate}) =>
this.setState({
startDate2:startDate,
endDate2:endDate
})
}
focusedInput={this.state.focusedInput2}
onFocusChange={focusedInput2 => this.setState({ focusedInput2 })}
readOnly={true}
hideKeyboardShortcutsPanel={true}
showClearDates={true}
startDateId="startDate2"
endDateId="endDate2"
isOutsideRange={() => false}
/>
**问题在于破坏了软件包发送的日期obj,这是一个有效的沙箱https://codesandbox.io/embed/magical-darkness-jh8kk?fontsize=14&hidenavigation=1&theme=dark