React 中 Component definition is

2023-05-28  本文已影响0人  很好就这样吧

该错误通常是在 React 中使用 forwardRefs 时导致的。
displayName 属性用于为 React devtools 扩展的组件提供一个描述性名称。
在组件上设置 displayName 属性以修复“Component definition is missing display name”错误,例如 App.displayName = 'MyApp';。 或者,禁用带有以下注释的行的 ESLint 规则 – // eslint-disable-next-line react/display-name。

const App = () => {
  return (
    <div>
      <h2>Hello world</h2>
    </div>
  );
};

// 👇️ set display name
App.displayName = 'MyApp';

export default App;
// eslint-disable-next-line react/display-name
const App = () => {
  return (
    <div>
      <h2>Hello world</h2>
    </div>
  );
};

export default App;

或者,我们可以通过将属性添加到 .eslintrc.js 文件的规则对象来禁用整个项目的 react/display-name 规则。

module.exports = {
  rules: {
    "react/display-name": "off",
  }
}
上一篇 下一篇

猜你喜欢

热点阅读