Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

completeUnitOfWork 中的部分注释有歧义 #69

Open
DaphnisLi opened this issue Mar 8, 2022 · 7 comments
Open

completeUnitOfWork 中的部分注释有歧义 #69

DaphnisLi opened this issue Mar 8, 2022 · 7 comments

Comments

@DaphnisLi
Copy link

DaphnisLi commented Mar 8, 2022

感觉这两个地方的注释是有歧义的。图二应该是相邻的下一个兄弟节点。图一的其他子节指的是父节点的其他子节点?
按理来说每次回溯到父节点,都会从左向右遍历兄弟节点,在有兄弟节点的时候都会 return 出去,然后进行外层的 while 。感觉一般情况下图一的代码好像不会被执行。
大佬能否解答下图一在什么情况下才会使 next !== null

image

image

@DaphnisLi
Copy link
Author

谢谢大佬解答

@jacty
Copy link
Contributor

jacty commented Mar 10, 2022

深度优先:先找当前节点下是否有子节点,没有的话则查找当前节点的兄弟节点,再没有则返回父节点进行同样类型的查找。
completeUnitOfWork 阶段会有VDOM 的拼接操作,这个拼接会导致当前节点存在新增节点的情况,则需要去查找该新增节点上的一些信息,比如是否还有更深的子节点以及新增节点的属性等。

@creamidea
Copy link

completeUnitOfWork 阶段会有VDOM 的拼接操作

这个能帮忙具体定位一下代码吗?我在 completeUnitOfWork 里面没有找到。谢谢

@7kms
Copy link
Owner

7kms commented Mar 11, 2022

这里实际上是在讨论completeWork函数的返回值, 绝大多数情况都返回的null(即不会派生出子节点). 只有一种特殊情况涉及到SuspenseComponent 和 SuspenseListComponent组件, 它们是有返回值的. @creamidea 已经贴上了对应的源码.
v17.0.2中, 这些组件虽然在源码中体现了, 实际上是用不上的. 这个是v18的feature, 需要安装v18对应的版本才能体验.

SuspenseComponent有下级fallback组件需要渲染, 所以completeWork函数会返回自身, 最后退出completeUnitOfWork, 再次进入beginWork阶段去生成fallback组件对应的fiber节点

@7kms
Copy link
Owner

7kms commented Mar 11, 2022

completeUnitOfWork 阶段会有VDOM 的拼接操作

这个能帮忙具体定位一下代码吗?我在 completeUnitOfWork 里面没有找到。谢谢

@jacty 指的vdom拼接是否就是指代的SuspenseComponent fallback这种形式?

@DaphnisLi
Copy link
Author

确实,通过源码看出来,目前 Suspense 会出现新增 fiber 节点的操作。感谢大佬们 🙏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants