样式化组件导入和 eslint 出错

Question

我在使用样式化组件和 eslint 时遇到错误，

我想在单独的文件中使用样式化组件，但出现错误

styledHeader' is defined but never used.

这是整个组件

import { styledHeader } from "./header.styled";

/**
 * return a JSX Element Header
 * @return {JSX.Element} <Header/>
 */
function Header() {
  return <styledHeader>
  </styledHeader>;
}

export default Header;

Answer 1

React 组件名称必须以大写字母开头。

它没有被使用，因为你没有将它用作一个有效的组件。

import { styledHeader as StyledHeader } from "./header.styled";

function Header() {
    return <StyledHeader></StyledHeader>;
}