chrome开发人员工具中未显示"React"标签 [英] React tab doesn't appear in chrome developer tools

问题描述

我已经安装了React Developer Tools Chrome浏览器扩展.但是我看不到开发人员工具中的React选项卡，而是有一个名为"Components"和&的新选项卡.探查器".

I have installed React Developer Tools Chrome browser extension. But i cannot see the React tab in developer tools instead there are new tabs named "Components" & "Profiler".

我重新安装了扩展程序，重新启动了浏览器和计算机，并在chrome://extensions/下选中了允许访问文件URL".我导航到了一个带有react https://reactjs.org/tutorial/tutorial.html &的网址;尚未显示反应"选项卡.但是chrome插件(浏览器右上方的反应检测器)指示其中包含react.js.如何显示反应"选项卡?

I re-installed the extension, restarted the browser and computer, checked "Allow access to file URLs" under chrome://extensions/ . I navigated to a url with react https://reactjs.org/tutorial/tutorial.html & yet react tab doesn't appear. However the chrome plugin (react detector in top right of the browser) indicates that react.js in it. How do I get the React tab to appear ?

我正在使用反应":"16.8.6"

I am using "react": "16.8.6"

推荐答案

您看不到React选项卡，因为Facebook更新了React DevTools使其具有组件"和探查器"选项卡.⚛️Components 标签的作用与旧版本中的React标签相同.来自说明，

You can't see React tab because, Facebook have updated React DevTools to have Components and Profiler Tabs. ⚛️ Components tab serves same purpose as React tab in older versions. From description,

您将在Chrome DevTools中获得两个新标签:⚛️组件"和⚛️Profiler".

You will get two new tabs in your Chrome DevTools: "⚛️ Components" and "⚛️ Profiler".

Components选项卡显示了根React组件呈现在页面上的元素以及它们最终生成的子组件渲染.

The Components tab shows you the root React components that were rendered on the page, as well as the subcomponents that they ended up rendering.

这可以从版本 4.0.0 中看到.请在此处查看发行说明

This can be seen from version 4.0.0. See the release notes here

这篇关于chrome开发人员工具中未显示"React"标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！