我从头开始构建了一个日历小部件，我正在尝试实现一个规则，该规则只允许用户点击/选择一个在他们选择的开始日期之后的结束日期。
我已经将开始和结束日期存储在组件的状态中，当我控制台记录开始和结束的日期时，一切看起来都很好。当我从if/else语句中删除day > this.state.selectedStartDay时，它确实允许我选择开始日期之后的日期(尽管它也允许我选择同月中较早的一天，这是而不是的正确行为(。
当我使用控制台日志语句运行此代码时，如果该if/else语句中没有day > this.state.selectedStartDay行代码，我会得到正确编号的开始和结束日期(即，如果我选择2月1日和2月14日，则开始日期记录1，结束日期记录14(。当我用day > this.state.selectedStartDay行代码运行它时，我会得到一些奇怪的行为：
- 它确实将用户的选择限制为所选开始日期之后的日期，但一些在开始日期之后的日期也会受到限制(即，如果我选择了2月4日，那么从2月10日起的任何日期也会被限制
我已经做了很多控制台日志，数据本身似乎是正确的，但我不明白为什么会发生这种行为。感谢您的帮助！
handleDateClick(month, day, yr) {
let clicks = this.state.clicks + 1;
let realMonthNum = month + 1;
this.setState({ clicks });
if (this.state.clicks % 2 === 0) {
this.setState({ selectedStartMonth: realMonthNum });
this.setState({ selectedStartDay: day });
this.setState({ selectedStartYr: yr });
this.resetEndDate();
} else if (month >= (this.state.selectedStartMonth - 1) && day > this.state.selectedStartDay) {
console.log('Start day: ' + this.state.selectedStartDay);
console.log('End day: ' + day);
this.setState({ selectedEndMonth: realMonthNum });
this.setState({ selectedEndDay: day });
this.setState({ selectedEndYr: yr });
}
}
更新：
我不知道为什么，但即使在比较语句中使用yr也不起作用：(
好的做法是在完成代码逻辑时使用setState一次。对局部变量执行逻辑操作，而不是在设置状态后立即使用状态(this.state.selectedStartMonth(