本文主要说明如何使this.setState({})中的state立即执行。
在react中只要状态state,无法设置全局变量,我们需要通过设置state来设置。
而,setState延迟更新的原因在于—state是异步执行的,只有render发生变化的时候才触发this.setState()。
(一)思路:想要在不更新render的情况下立即执行(同步执行),需要在setState后加上一个function函数。
当然,render更新了之后对state的值没有任何影响。
现在只是说,在没有更新render的情况下,我们加上了function也能获取到state的值
(二)具体解决方案:
// 1.设置代码
this.setState({
myState: 'doubi'
}, function() {
// stateFunction是需要立即用到
this.stateFunction()
})
// 2.在函数中直接调用
stateFunction() {
console.log('doubi', this.state.myState)
}
(三)提醒:
// 1.在setState中的调用的stateFunction()函数不会立即执行,调用的时候才执行该函数。
// 也就是说,setState中的function只是声明能立即用到,而不会立即执行。
// 2.当stateFunction()函数里面有传入参数的时候,在设置setState的时候,也需要函数。
// 如下代码----------
//如果函数是这样的===>
stateFunction(y, z) {
let abc = []
if(y.length>0) {
abc.push(z)
}
console.log('doubi', this.state.myState)
return abc
}
// 那么在setState中应该这样设置====>
this.setState({
myState: 'doubi'
}, function() {
// stateFunction的参数是不能少的哦
this.stateFunction(y, z)
})
这样就ok了!!!