1
0
Fork 0
Browse Source

vault backup: 2022-04-16 10:54:44

master
YuJian920 3 years ago
parent
commit
fd4a0a6f4a
  1. 5
      React 的源码深入/React Reconciler - Fiber 创建.md

5
React 的源码深入/React Reconciler - Fiber 创建.md

@ -7,8 +7,9 @@
## 首屏渲染 ## 首屏渲染
### createWorkInProgress ### createWorkInProgress
React 的首屏渲染时会交由 createWorkInProgress 函数生成一个 WorkInProgress Fiber 节点 ,createWorkInProgress 接收两个参数,分别是 current 和 pendingProps,这里的 pendingProps 是组件的属性 React 的首屏渲染时会交由 createWorkInProgress 函数生成一个 WorkInProgress Fiber 节点,这个节点就是 FiberNode,createWorkInProgress 接收两个参数,分别是 current 和 pendingProps,这里的 pendingProps 是组件的属性
因为传入的是 current Fiber 树,所以 createWorkInProgress 内会从 current 的 alternate 取出中取出与之链接的 WorkInProgress Fiber 节点,并对其做空值判断,因为对于首屏渲染而言,WorkInProgress 是不存在的,所以会走到不存在 WorkInProgress 的逻辑,在这里也就是调用 createFiber 函数,这个函数会更加传递的参数 new 一个 Fiber 的实例,其内部并没有什么复杂的逻辑,而是对 Fiber 节点的属性进行了初始化,createFiber 返回之后,会对返回的 Fiber 节点进行赋值,复用 current Fiber 节点的内容,并对它们各自的 alternate 进行赋值,双向链接 因为传入的是 current Fiber 树,所以 createWorkInProgress 内会从 current 的 alternate 取出中取出与之链接的 WorkInProgress Fiber 节点,并对其做空值判断,因为对于首屏渲染而言,WorkInProgress 是不存在的,所以会走到不存在 WorkInProgress 的逻辑,在这里也就是调用 createFiber 函数,这个函数会更加传递的参数 new 一个 Fiber 的实例,其内部并没有什么复杂的逻辑,而是对 Fiber 节点的属性进行了初始化,createFiber 返回之后,会对返回的 FiberNode 节点进行赋值,复用 current FiberNode 节点的内容,并对它们各自的 alternate 进行赋值,双向链接
createWorkInProgress 之后,Fiber d
### beginWork ### beginWork

Loading…
Cancel
Save