ReactjsDev 工具中的钩号对应于什么？

我有一个 react.js 应用程序，我想分析性能问题。

我正在使用 Firefox 中的反应开发工具分析器。

我分析了一个特定的交互，并在开发工具中获得了火焰图和排名时间图。

然后这条消息出现在 dev 工具中:

enter image description here

开发工具的这一部分不是交互式的，我找不到任何关于钩子如何编号的信息。

我该如何解读这些数字？它们对应什么？我在哪里可以找到他们所指的钩子的信息？

16594 次浏览
小开
最佳答案

This is the PR where they added that feat. They didn't provide a better UI due to some performance constraints. But you can find what hooks those indexes correspond to if you go to the components tab in dev tools and inspect said component; in the hooks section, you'll have a tree of the called hooks, and for each hook, a small number at the left which is the index. You'll probably need to unfold the tree of hooks to find them.

Here's a screenshot from the linked PR

enter image description here


提交答案