如何解决React useReducer挂钩和功能组件生命周期保证
我想确认一个关于功能组件和useReducer的假设。据我了解,useState是幕后的useReducer,因此在本示例中将使用useState进行简化。
function Example(){
const [count,setCount] = useState(0);
return <Button onClick={()=> setCount(c=>c+1)} >{count}</button>
}
我可以保证在调用setCount
之后,下一个渲染周期将包含更新的count值。我知道可以批量处理更新,以便可以在看到渲染之前多次调用setCount,但是在应用setCount的更改之前是否可以看到渲染?
批处理更新可能会导致类似这样的情况(假设我在同一事件调用中再次调用setCount或在进行中有悬念):
0
click => 1
click,click => 3 // 2 did not result in a render
click,click,click => 6 // 4 and 5 did not result in a render
这就是为什么使用setCount的委托重载以确保它正在修改状态的当前版本至关重要。
但是,是否有可能看到两次渲染相同的状态,一次在单击之前,一次在之后:
0
click => 0
1
click => 2
在上面的示例中,计数从0开始,我单击了(调用setCount),但是随后在“应用” setCount之前看到一个旧的“排队”渲染。因此,即使单击并调用setCount,我也看到了一个旧的渲染,然后看到由setCount触发的新值。这是否可能,或者可以安全地假设我将永远不会看到比最后一次setCount调用中的值还早的值的渲染器。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。