乐趣区

关于javascript:react的setState函数同步还是异步

面试总被问到??

1、由 React 管制的事件处理程序,以及生命周期函数调用 setState 不会同步更
新 state。
2、React 管制之外的事件中调用 setState 是同步更新的。比方原生 js 绑定的事
件,setTimeout/setInterval 等。

class Example extends React.Component {constructor() {super()
    this.state = {val: 0}
  }
  componentDidMount() {this.setState({ val: this.state.val + 1})
    console.log(this.state.val)
    // 第 1 次 log
    this.setState({val: this.state.val + 1})
    console.log(this.state.val)
    // 第 2 次 log
    setTimeout(() => {this.setState({ val: this.state.val + 1})
      console.log(this.state.val)
      // 第 3 次 log
      this.setState({val: this.state.val + 1})
      console.log(this.state.val)
      // 第 4 次 log
    }, 0)
  }
  render() {return null}
} // 0, 0, 1, 2
退出移动版