vault backup: 2022-04-19 17:20:48

React 的源码深入/Fiber 数据结构.md

@@ -1,10 +1,18 @@
- Fibet 中的 tag 属性保存了组件类型，如 Function Component、Class Component
-- Fiber 中的 type 属性在使用 Function Component 时是函数本身，Class Component 时是 Class，Host Component 时是 DOM 节点的 Tag Name
-- Fiber 中的 stateNode 属性对于 Host Component 而言，是它的真实 DOM 节点
 - Fiber 中的 return、child、sibling 属性则对应链接Fiber链表中的父节点、子节点和兄弟节点
 - Fiber 中的 index 属性代表在多个同级 Fiber 节点中，它们插入的位置索引
 - Fiber 中带有 effcet 名称的属性代表与副作用相关，Host Component 中的 DOM 的增删改查，Functuon 中的 useEffect、useLayoutEffect
 - Fiber 中的 lanes 属性和 childLanes 属性与 Fiber 的优先级的调度有关
 - Fiber 中的 alternate 属性则表示了 Fiber 的工作方式
 
-`elementType` : 在大部分时候和 `type` 是相同的，在 FunctionComponent 使用 `React.memo` 会有不同
+`elementType` : 
+> 大部分时候和 `type` 是相同的
+> FunctionComponent 使用 `React.memo` 会有不同
+
+`type` : 
+> FunctionComponent 而言是函数本身
+> ClassComponent 而言是 Class
+> Host Component 而言是 DOM 节点的 Tag Name
+
+`stateNode` : 
+> HostComponent 而言，是它的真实 DOM 节点
+> ClassComponent 时是 clsss 实例