react setState({}) setstate((state)=>{}) 区别

setState(updater, callback) 是react里的一个常用方法，用来改变组件state来触发视图更新,它接受两个参数，一个更新器和一个回调函数。
setState() 不是一个同步方法，而是一个异步方法,它会批量推迟更新,比如

  state={
    num:1,
    count:0
  }
  componentDidMount(){
    this.setState({num:this.state.num+1})
    this.setState({count:this.state.count+1})
    console.log(this.state.num,this.state.count)
    this.setState({num:this.state.num+1},()=>{
      console.log(this.state.num,this.state.count)
    })
  }

结果是

1 0
2 1

这里又引发了一个问题 this.setState({count:this.state.num+1})执行了两次，但是最后计算的出来的num 是2而不是3，这是因为是批量推迟更新的，而这个时候this.state.num仍然是1，所以相当于执行了两次this.setState({num:1+1}) 说以最后计算出来的num是2
这里我们把代码修改一下

  state={
    num:1,
    count:0
  }
  componentDidMount(){
    this.setState((state)=>{return {num:state.num+1}})
    this.setState((state)=>{return {count:state.count+1}})
    console.log(this.state.num,this.state.count)
    this.setState((state)=>{return {num:state.num+1}},()=>{
        console.log(this.state.num,this.state.count)
    })
  }

结果是

1 0
3 1

setstate((state)=>{}) 同样是批量推迟更新,但是(state)=>{}里的state是取的当前的状态，所以执行了两次this.setState((state)=>{return {num:state.num+1}}) 获得了3.