setState 中的同步异步问题

setState是同步还是异步的？

答案是：可能是异步的

1 . 异步情况 （1）在合成事件中 ，也就是react规定的onClick等事件中 setState是异步的

        （2）在生命周期中setState也是异步的

2 . 同步情况 （1）在定时器中 setState是同步的

                        （2）在js原生事件中setState也是同步的

异步带来的问题 

                        (1)累加问题

   由于 setState是异步的 在更改数据后 不能直接获取更改后的数据 而是更改前的数据 因此累加失败 ，以下是解决方案 用回调函数传上一次state，返回解果 ；还有一种方法就是在setTimeout中进行；或者用promise.then处理

 class App1 extends Component {
            state = {
                count: 0
            }

            handleClick = () => {

                // 01 
                // this.setState({
                //     count:this.state.count+1
                // })
                // console.log(this.state.count) //0 验证异步

                //02 累加问题
                // this.setState({count:this.state.count+1})
                // this.setState({count:this.state.count+1})
                // this.setState({count:this.state.count+1})

                //解释
                // this.setState({count:1})
                // this.setState({count:1})
                // this.setState({ count:1})
                // 合并
                // this.setState({ count:1})

                // 传函数 参数是上一个state : 解决累加问题
                this.setState((prestate) => {
                    return {
                        count: prestate.count + 1
                    }
                },()=>{
                  console.log("count",this.state.count);
                })
                this.setState((prestate) => {
                    return {
                        count: prestate.count + 1
                    }
                })
                this.setState((prestate) => {
                    return {
                        count: prestate.count + 1
                    }
                })

                console.log(this.state.count) // 0 

            
                // setState({})
                // setState(()=>{})
                // setState({},()=>{})

                // console.log(this.state.count) // 0 

            }

            render() {
                console.log('render')
                return (
                    <div>
                        <p>you clicked {this.state.count}</p>
                        <button
                            onClick={() => {
                                this.handleClick()
                            }
                            }
                        >click me</button>
                    </div>
                )
            }
        }

                （2）获取异步结果

                只需要在setState的第二个函数参数中获取即可

                  （3）批量更新

                是异步带来的效果，多次修改数据，统一更新数据