diff --git a/React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md b/React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md index 1d27993..767ca0e 100644 --- a/React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md +++ b/React 的源码深入/React 的流程解析 - Fiber 递归/React 的深入探索 - beginWork.md @@ -31,7 +31,7 @@ if (current !== null) { } ``` -在进入正式 beginWork 阶段之前,会先对传入的 current 节点进行空值判断,根据 current 是否为空进入不同的处理逻辑,这一段代码的主要目的是为了赋值 didReceiveUpdate 变量 +在进入正式 beginWork 阶段之前,会先对传入的 current 节点进行空值判断,根据 current 是否为空进入不同的处理逻辑,这一段代码的主要目的是为了赋值 didReceiveUpdate 变量, ### current 不为空 diff --git a/自顶向下学 React 源码/React 源码的碎片记录.md b/自顶向下学 React 源码/React 源码的碎片记录.md index 7065f95..c897367 100644 --- a/自顶向下学 React 源码/React 源码的碎片记录.md +++ b/自顶向下学 React 源码/React 源码的碎片记录.md @@ -7,7 +7,7 @@ - reconcileChildren 方法接受 current 参数,通过判断这个参数是否为 null,分别执行 mountChildFibers 或 reconcileChildFibers 方法 - mountChildFibers 和 reconcileChildFibers 都是由 ChildReconciler 方法创建的,只是传入的布尔值会不同,而这个参数表示是否追踪副作用,mountChildFibers 为 false,reconcileChildFibers则相反 - 以 reconcileChildFibers 为例,会对 Children 的类型做判断,对判断结果分别做相应操作 -- completeWork 会对 beginWork 创建好的 Fiber 进行填充,根据 Fiber 类型的不同有不同的处理逻辑,其中有一步就是创建真实 DOM 元素并将之前创建好的 DOM 元素插入 +- completeWork 会对 beginWork 创建好的 Fiber 进行填充,根据 Fiber 类型的不同有不同的处理逻辑,其中有一步就是创建真实 DOM 元素并将之前创建好的 DOM 元素插入 - finalizeInitialChildren 为创建的 DOM 元素,插入已有的 props,内部也根据 Fiber 节点的 tag 区分不同的处理逻辑,还有对 props 是否合法的校验,甚至根据 props 的属性也做了不同逻辑的处理,最终交由 setValueForProperty 处理 - completeWork 中的 appendAllChildren 会将创建好的真实DOM元素插入之前创建的子DOM元素 - 对于首屏渲染,只会有一个节点被打上 effectTag,就是根节点,只需要根节点被打上 effectTag 那么就能渲染剩下的全部内容