From f01a48c52fe15c5e30165ce45c6662818e795517 Mon Sep 17 00:00:00 2001 From: YuJian Date: Wed, 20 Apr 2022 10:25:30 +0800 Subject: [PATCH] vault backup: 2022-04-20 10:25:30 --- .../React Reconciler - Fiber 创建.md | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/React 的源码深入/React Reconciler - Fiber 创建.md b/React 的源码深入/React Reconciler - Fiber 创建.md index 9b7dd9a..db220b2 100644 --- a/React 的源码深入/React Reconciler - Fiber 创建.md +++ b/React 的源码深入/React Reconciler - Fiber 创建.md @@ -92,11 +92,17 @@ createInstance 会调用 createElement 方法创建一个 DOM 实例，并调用 这里有两个 for in 循环：循环旧 `props` 属性和循环新 `props` 属性 循环旧 props 属性： -- 新 props 不存在相同属性 **或** 属性非旧 props 自身属性 **或** 该属性在旧 props 的值为 null，以上条件为 true 会跳出当前属性的循环 +- 以下条件跳出当前循环： + 1. 新 props 自身不存在相同属性 + 2. 属性非旧 props 自身属性 + 3. 该属性在旧 props 的值为 null - 当找到 style 属性，会遍历 style 属性，初始化 styleUpdates 对象为空，并在上边新增 style 属性的 key 并赋值空字符串 -- 当找到一些特殊属性如 `dangerouslySetInnerHTML` 等，会初始化 updatePayload 为空数组 -- 如果没有以上属性，即没有 style 和 特殊属性，会进入最后的 else 逻辑： +- 当找到一些特殊属性如 `dangerouslySetInnerHTML` 等，会初始化 `updatePayload` 为空数组 +- 如果没有以上属性，即没有 style 和 特殊属性，会进入最后的 else 逻辑：给 `updatePayload` 数组 `push` 进属性名和 null，进入下一轮循环 +循环新 props 属性： +- 以下条件跳出当前循环; + 1. 新 props 自身不存在当前属性 ## 第二次触发更新和后续触发更新