Reactjs setState异步设置函数中的props参数有什么意义
在React中,由于Reactjs setState异步设置函数中的props参数有什么意义,reactjs,Reactjs,在React中,由于setState方法的某些异步特性,当您希望基于状态的先前值更新状态时,您需要传入一个函数作为第一个参数,以便在实际更新状态时setState可以访问状态的最新版本。e、 g const setStateCallback = prevState => { return {myInteger: prevState.myInteger + this.props.step}; } this.setState(setStateCallback); 我的问题是,如果sta
setState
方法的某些异步特性,当您希望基于状态的先前值更新状态时,您需要传入一个函数作为第一个参数,以便在实际更新状态时setState
可以访问状态的最新版本。e、 g
const setStateCallback = prevState => {
return {myInteger: prevState.myInteger + this.props.step};
}
this.setState(setStateCallback);
我的问题是,如果state是唯一可能过期的数据,那么函数中的props
参数有什么意义。为什么不直接使用
const setStateCallback = prevState => {
return {myInteger: prevState.myInteger + this.props.step};
}
this.setState(setStateCallback);
我假设setState
工作的方式是setStateCallback
被存储,并且在React
准备好处理所有setState
调用后将被调用。在那个时候,是的,我需要访问过程中使用其他setState
调用时发生的状态更新。但是,当调用setStateCallback
时,同时对this.props.step
所做的任何更新都将在this.props.step
上可用,因为我引用的是this.props
对象。如果我这样做了
const step = this.props.step
const setStateCallback = prevState => {
return {myInteger: prevState.myInteger + step};
}
this.setState(setStateCallback);
这是一个问题,因为步骤
(假设这是一个数字或字符串)的值不再被props对象引用,并且可能已过期
因此,假设我的假设是正确的,那么访问回调setStateCallback
的props
参数似乎是不必要的
更新
正如Brad Bumbalough所指出的,下面是我自己的一点额外证据,props
arg确实是必要的
这一发现意味着,在自定义类方法中访问
this.state
或this.props
时,必须小心。例如对于在setState
回调中调用的任何自定义类方法,您需要确保这些方法中的任何引用或由该调用生成的后续类方法中的任何引用都将state
和props
作为参数,并且不引用this.props
或this.state
I我认为他们的观点是,一切都是异步的。因此,如果您明确依赖于props
来更改状态,则无法100%确定this.props
在setState
调用首次排队后没有更改
这将成为问题的可能生命周期可能是…
setState
调用(prevState.myInteger+props.step
)。将立即使用当前状态/道具对其进行评估,并将结果存储为状态属性的新值setState
呼叫已排队setState
调用已被处理和应用,但用于生成存储状态数据的道具现在与用户可以看到的当前道具不同步,导致混乱、混乱和WW3。好吧,我可能夸大了我不确定我是否理解你对3的假设。我只是更新了问题,以便更清楚地说明我的假设。你觉得怎么样?谢谢!今晚晚些时候我检查了一下,并进行了相应的更新。好的,我花了一些时间阅读了这篇文章,答案似乎在
updateComponent
implementation中。似乎可以在调用所有setState
回调后切换对this.props的引用。这意味着在setState
回调中引用this.props
不保证是最新的,并且props
参数是您拥有最新道具的唯一保证。