From 5aed5c89aedc9863c5ca8a0493bd1571241b2e2d Mon Sep 17 00:00:00 2001 From: YuJian Date: Tue, 26 Apr 2022 15:27:42 +0800 Subject: [PATCH] vault backup: 2022-04-26 15:27:42 --- .../React 的流程解析 - commit阶段.md | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/React 的源码深入/React 的流程解析 - commit 阶段/React 的流程解析 - commit阶段.md b/React 的源码深入/React 的流程解析 - commit 阶段/React 的流程解析 - commit阶段.md index a6a8cbd..c337e14 100644 --- a/React 的源码深入/React 的流程解析 - commit 阶段/React 的流程解析 - commit阶段.md +++ b/React 的源码深入/React 的流程解析 - commit 阶段/React 的流程解析 - commit阶段.md @@ -4,3 +4,12 @@ commitRoot 在 React 18 的代码和 React 17 有着较大的不同，但是最 commitRoot 的代码很少，其中最主要的是执行 commitRootImpl 函数，也就是说 commit 阶段最核心的任务就发生在 commitRootImpl 中，在 React 18 中，commitRootImpl 函数发生了比较大的变化，以往 17 中，主要有三个循环，这三个循环主要代表了 commit 的阶段的三个时刻：分别是 before、mutation 和 layout，也对应了三个函数 commitBeforeMutationEffect、commitMutationEffects 和commitLayoutEffects，18 中这三个函数依旧存在，但已经不是在循环被执行了，以下的文章内容会先从 React 17 开始，然后再探讨在 React 18 中发生的变化~~如果我不懒的话~~ +进入 commitRootImpl 函数内部，首先会执行一个 do..while 循环 + +```javascript +do { + flushPassiveEffects(); +} while (rootWithPendingPassiveEffects !== null); +``` + +这个循环的跳出条件是 rootWithPendingPassiveEffects 等于 null， \ No newline at end of file