React Developer Tools

插件简介

将反应调试工具添加到Chrome开发工具中。创建于3/30/2022版本

React Developer Tools是一个开源的React JavaScript库的Chrome开发工具扩展。它允许你在Chrome开发工具中检查React组件层次结构。

您将在您的chromedevtools中得到两个新标签:“something Components”和“something Profiler”。

“组件”选项卡显示在页面上呈现的root React组件，以及它们最终呈现的子组件。

通过选择树中的一个组件，您可以检查和编辑它当前的道具和状态在右边的面板中。在breadcrumbs中，您可以检查选定的组件、创建组件的组件、创建组件的组件，等等。

如果您使用常规元素选项卡检查页面上的React元素，然后切换到React选项卡，该元素将在React树中自动选择。

Profiler选项卡允许您记录性能信息。