React 开发者工具将所有组件显示为“匿名”-解网

问：

我已经在 Google Chrome 上安装了 React 开发人员工具扩展来调试用 TypeScript 编写的 React 应用程序，但是一旦我开始调试应用程序并打开“组件”窗口，所有组件都显示为“匿名”。

当然，应用程序主要使用功能组件。

有谁知道是否有办法让 React 开发人员工具在其组件树中显示组件名称？

reactjs typescript react-devtools

评论

答：

7赞 pritam 6/2/2020 #1

如果您使用的是导出的匿名功能组件或备忘录组件;它将显示为Anonymous

参考这个 - https://github.com/facebook/react/issues/17876

或者尝试这里提到的解决方案 - React Dev 工具将我的组件显示为未知

11赞 emeraldsanto 6/2/2020 #2

当您像这样定义组件时，就会发生这种情况：

// Default arrow function export
export default () => {
    // ...
}

// Default function export
export default function() {
    // ...
}

您可以替换为以下内容来解决问题：

const CustomComponent = () => {
    // ...
}

export default CustomComponent;

// or

export default function YourComponent() {
  // ...
}

上一个：在 DNSAPI 中找不到 DNS 函数

下一个：如何在python中运行后台任务