setState()同步异步
setState()会出现state延迟更新的情况,不要用setTimeout函数调用setState来改进。setState是异步的,可以通过调用回调函数来解决。
- 关于setState()是同步还是异步的说法,准确来说,在React内部机制能够检测到的地方,setState是异步的;在React检测不到的地方,比如setInterval,setTimeout里,setState是同步更新的。【setInterval表示按照指定的周期来调用函数,一直到clearInter为止。setTimeout表示在指定的毫秒数后调用函数】。
换句话说,setState只在合成事件(onClick,onChange)和钩子函数(钩子函数一般是在某个框架里面的叫法,是这个框架在生命周期的某个阶段触发的回调函数,如componentDidMounted)。是异步的。在原生事件(非react合成事件,原生自带的事件监听addEventListener,或直接用原生js、jq直接document.querySelector().onClick这种绑定事件的形式都是原生事件)和setTimeout中是同步的。
当setState接受一个回调函数时,这个回调函数会在setState完成以后直接调用,这样在这个回调函数中就可以获得最新的state。