为什么React将状态设置为*先前*单击的状态？

Question

class App extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            dateClicked: ''
        };
    }

    onDateClick(date) {
        this.setState({
            currentDateEntry: date
        });
        console.log(this.state.currentDateEntry);
    }

  render ....
}

我有一个HTML日期列表。当我执行第一次单击时，它会控制日志null。我必须再次点击相同的日期，以便控制台记录正确的日期。如果我然后单击另一个日期，它将控制日志记录上一个日期（即 - 它保持不变）。我必须再次点击第二个日期才能将状态设置为新日期。

所以这个过程就像这样：

（动作，dateClicked状态）： （点击日期x，null）， （点击日期x，日期x）， （点击日期y，日期x）， （点击日期y，日期y）

造成这种情况的原因是什么？为什么状态不正确更新？

Answer 1

documentation解释说：

  

setState()不会立即改变this.state，但会创建待处理状态转换。在调用此方法后访问this.state可能会返回现有值。

Answer 2

您应该使用回调或使用ReactJS生命周期方法https://facebook.github.io/react/docs/component-specs.html

E.g。 componentWillUpdate：

componentWillUpdate() {
  console.log(this.state.currentDateEntry);
}