react state不更新更新

Question

tab切换的时候更新当前选择的tab，debugger发现state并没有更新，请问具体原因是什么，万分感谢！

constructor(props) {
    super(props)
    this.state = {
      selected: 'blacklist'
    }
  }

tabChange(newSelected) {  // newSelected = "score"
    const {selected} = this.state; // selected = "blacklist"
    debugger
    if (selected !== newSelected) { // selected = "blacklist", newSelected = "score"
      this.setState({
        selected: newSelected,
      })
      const {tabChange} = this.props
      tabChange(newSelected)
    }
    debugger
    const state = this.state //state = {selected: "blacklist",}
    console.log(state)
  }

Answer 1

setState 是异步的. 你需要在回调里回去获取更新后的 state.

this.setState({
  selected: newSelected,
}, function() {
    console.log(this.state)
});

Answer 2

react在生命周期和event handler里的setState会被合并（异步）处理。（17版本以后全都会变异步）