前言：
当前朋友们对“react的渲染”大体比较关切，姐妹们都需要分析一些“react的渲染”的相关文章。那么小编同时在网络上汇集了一些对于“react的渲染””的相关内容，希望我们能喜欢，你们快快来学习一下吧！入口是ReactDOM.render(<App />, document.getElementById('root'))
子元素只是一个div元素的渲染流程图
2.第一排的几个逻辑，基本上包含其它的方法比较少，只是对数据进行处理，执行下面的流程
3.重点是performUnitOfWork的循环，循环逻辑是workInProgress不为空就执行，就一直执行performUnitOfWork，workInProgress是是上图中begginWork/completeWork的返回结果，也就是数的遍历，从上到下，从左到右，对应的下一个。
其中performUniOfWork对于数据的协调是在reconcileChildren里去完成的，采用fiber的数据结构，结构中重点的几个属性，stateNode/return/child/sibling分别对应当前节点/父节点/第一个子节点/第一个兄弟节点，采用链表的结构操作树在第一排的renderRoot中有两部分的逻辑方法，一个是workLoopSync主要是下面performUniOfwork对数据的操作，另一个是commitRoot对虚拟DOM的渲染，在workLoopSync执行完成后执行commitRoot
版权声明：
本站文章均来自互联网搜集，如有侵犯您的权益，请联系我们删除，谢谢。
标签： #react的渲染
