react/display-name Pedantic

强制 React 组件拥有 displayName 属性。

React DevTools 使用 displayName 在组件树中显示组件名称。如果没有 displayName，组件在 DevTools 中会显示为“未知”。

以下是此规则的错误代码示例：

jsx

const MyComponent = () => <div>Hello</div>;

以下是此规则的正确代码示例：

jsx

const MyComponent = () => <div>Hello</div>;
MyComponent.displayName = "MyComponent";

配置

此规则接受一个包含以下属性的配置对象：

type: boolean

default: false

当为 true 时，此规则会对没有 displayName 的上下文对象发出警告。

displayName 允许你为你的上下文命名对象。此名称会在 React DevTools 中用于上下文的 Provider 和 Consumer。

type: boolean

default: false

当为 true 时，该规则会忽略由转译器设置的名称，并在这种情况下要求提供 displayName 属性。

To enable this rule using the config file or in the CLI, you can use:

Config (.oxlintrc.json)Config (oxlint.config.ts)CLI

json

{
  "plugins": ["react"],
  "rules": {
    "react/display-name": "error"
  }
}

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["react"],
  rules: {
    "react/display-name": "error",
  },
});

bash

oxlint --deny react/display-name --react-plugin

此规则于 v1.42.0 中新增。