setState没有更新React[重复]中的设置值

Question

下面是我尝试更新状态值的代码。我不明白为什么我的状态没有更新。我在每一行代码中添加了所有相应的控制台值。

handleFilter=(event)=>
  {
    console.log(this.state.answerStatus) // Before update 'all'
    let val= event.target.value === "answered";
    console.log(val); // true or false
    this.setState({answerStatus:val});
    console.log(this.state.answerStatus); // 'all'
  }

Answer 1

状态更新是异步的。

要查看setState之后的更新值，请使用第二个参数，该参数采用回调函数，并在那里发布控制台日志。

js prettyprint-override">handleFilter = (event) => {
  console.log(this.state.answerStatus); // Before update 'all'
  let val = event.target.value === "answered";
  console.log(val); // true or false
  this.setState({ answerStatus: val }, () =>
    console.log(this.state.answerStatus)
  );
};

Answer 2

在ReactsetState中是异步的，这意味着在调用setState后不会立即修改sate值，这就是为什么您从console.log.获取旧值

为什么setState在reactjs异步而不是同步？

反应文档

handleFilter = (event) => {
    console.log(this.state.answerStatus) // Before update 'all'

    let val= event.target.value === "answered";

    console.log(val); // true or false

    this.setState({answerStatus:val}, () => {
       console.log(this.state.answerStatus);
    });
    
  }