diff --git a/React 的深入探索/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md b/React 的深入探索/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md index 2ef7051..f9f3ba3 100644 --- a/React 的深入探索/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md +++ b/React 的深入探索/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md @@ -68,10 +68,10 @@ if ( 此时会先调用 checkScheduledUpdateOrContext 函数检查 current 是否存在优先级相关的更新,关于 React 优先级相关我们先暂且按表不谈,进入 if 判断 - 不存在优先级相关的更新且 workInProgress 节点不存在 DidCapture flag - - 跳过后续的正式 beginWork 阶段,进入 baliout 也就是组件复用逻辑 -- 以上判断条件不成立,判断当前 current 节点是否存在 ForceUpdateForLegacySuspense flag - - True:didReceiveUpdate 赋值为 true - - False:didReceiveUpdate 赋值为 false + - True:跳过后续的正式 beginWork 阶段,进入 baliout 也就是组件复用逻辑 + - False:判断当前 current 节点是否存在 ForceUpdateForLegacySuspense flag + - True:didReceiveUpdate 赋值为 true + - False:didReceiveUpdate 赋值为 false ```javascript // props 和 context 都没有发生变化,检查优先级相关 @@ -100,7 +100,7 @@ if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) { } ``` -至此 current 不为空的逻辑就结束了,我们可以在这里做个小小的总结:**在 beginWork 阶段 React 会先判断当前组件是否发生变化需要更新, 是否可以复用,满足复用条件情况下进入 baliout 逻辑不再创建新的 Fiber 节点,从中可以看到对于特殊组件如Suspense 而言可能并不会进入 baliout 逻辑** +至此 current 不为空的逻辑就结束了,我们可以在这里做个小小的总结:**在 前beginWork 阶段主要是判断当前组件是否发生变化需要更新, 是否可以复用,在满足复用条件情况下会跳过 正式beginWork 阶段进入 baliout 逻辑而不再创建新的 Fiber 节点,从中可以看到对于特殊组件如 Suspense 而言可能并不会进入 baliout 逻辑** 在此之外我们也可以看到一些很有意思的点:**对于组件新旧 props 对比使用的是简单的三等判断**