在样式化组件中引用另一个组件时,我收到此错误
ReferenceError: 初始化前无法访问“SiteHeader”
这是代码
//Common.ts
import styled from 'styled-components/macro';
import { SiteHeader } from '../Theme/Layout/Header';
export const Container = styled.div`
padding: 0 15px;
${SiteHeader} & {
padding-top: 20px;
padding-bottom: 20px;
}
`;
Run Code Online (Sandbox Code Playgroud)
//header.tsx
import { Container } from '../../Styles/Common';
import styled from 'styled-components/macro';
export default function Header(): JSX.Element {
return (
<SiteHeader>
<Container>
{/*navigation*/}
</Container>
</SiteHeader>
);
}
export const SiteHeader = styled.header`
background: var(--green-kelp);
`;
Run Code Online (Sandbox Code Playgroud)