句柄选择时的反应日期选择器选择对象范围

react setstate是异步的,因此您将面临这样的问题, setState将回调作为其第二个参数,您可以在该回调中调用handlerangeselected函数

你可以查一下 https://codesandbox.io/s/011x911nyl 我刚刚在回调中记录了“state updated”,只需将其更改为call handlerangeselected

您的状态似乎正在正确更新,但请记住 setState 是异步的,所以当你 console.log 在你的内心 handleRangeSelected , 状态尚未更新。

如果要在更新后立即记录它,可以将回调传递给 设置状态 里面 handleChange :

handleChange = ({ startDate, endDate }) => {
  startDate = startDate || this.state.startDate;
  endDate = endDate || this.state.endDate;
  if (startDate.isAfter(endDate)) {
    endDate = startDate;
  }
  // Pass callback to log selected range
  this.setState({ startDate, endDate }, () => {
    const range = {
      startDate: moment(this.state.startDate).format("DD-MM-YYYY"),
      endDate: moment(this.state.endDate).format("DD-MM-YYYY")
    };
    console.log("Range selected!", range);
  });
};

你在打电话 onChange 和 onSelect 在你的约会对象中。它们都同时触发,因此设置新状态的一个被触发,另一个使用旧状态值。我把你的密码改成了 handleRangeSelected 在中的setstate回调中 handleChange

this.setState({ startDate, endDate }, this.handleRangeSelected);