2 回答
TA贡献1818条经验 获得超11个赞
首先,让我们看看丹·阿布拉莫夫对这件事是怎么说的:
在当前版本中,如果您在 React 事件处理程序中,它们将被批处理。React 批处理在 React 事件处理程序期间完成的所有 setState,并在退出自己的浏览器事件处理程序之前应用它们。
在当前版本中,事件处理程序之外的几个 setStates(例如在网络响应中)将不会被批处理。所以在这种情况下你会得到两次重新渲染。
嗯,所以我们可以从 React 事件处理程序及其外部执行 setState 。React 事件处理程序是我们作为 prop 传递给组件的函数。
如果我们在handleClickAwaitBefore
没有 async-await 的情况下获取并重写它,我们会得到这样的结果:
function handleClickAwaitBefore() {
console.clear();
// Here we are in event handler and setState is batched
mockAPI().then(function notEventHandlerAnyMore(){
// Here we are in totally different function and setState is not batched any more
console.log(fromAPI);
console.log("Calling 1st setState()");
updateBooleanState(false);
console.log("Calling 2nd setState()");
updateBooleanState(true);
console.log("After 2nd setState()");
})
}
添加回答
举报