this.setState([partialState],[callback])
[partialState]:支持部分状态更改
this.setState({
x:100 //不论总共有多少状态,我们只修改了x,其余的状态不动
});
[callback]:在状态更改/视图更新完毕后触发执行「也可以说只要执行了setState,callback
一定会执行」
+ 发生在componentDidUpdate周期函数之后「DidUpdate会在任何状态更改后都触发执行;而
回调函数方式,可以在指定状态更新后处理一些事情;」
+ 特殊:即便我们基于shouldComponentUpdate阻止了状态/视图的更新,DidUpdate周期函数
肯定不会执行了,但是我们设置的这个callback回调函数依然会被触发执行!!
+ 类似于Vue框架中的$nextTick!!
在React18中,setState操作都是异步的「不论是在哪执行,例如:合成事件、周期函数、定时器...」但是在React16中setState只在周期函数和合成事件中是异步的,其他中都是同步的。
//可以杀心updater更新队列,让修改状态的任务立即刷新一次
import { flushSync } from "react-dom";
flushsync()/flushsync(()=>{xxxxx})
state={
x:0
}
this.setState((prevState)=>{
prevState:之前的值
return的对象就是我们想要我修改的值
return {
xx:prevState.x+1 //可以拿到每次更新前上一次的值
}
})