我喜欢使用 BEM 概念。我想将 BEM 应用于样式组件,我在下面找到了解决方案。
const Something = styled.div``;
const SomeElement = styled.div``;
Something.SomeElement = SomeElement;
export default Something;
但是使用 typescript 时,会出现 StyledComponent
没有 SomeElement
属性的错误。为了解决这个问题,一些 stackoverflow 答案提出了一个解决方案,下面的代码是我应用该解决方案的内容。
import styled, { DefaultTheme, StyledComponentBase } from 'styled-components';
import Description from './Description';
import Sup from './Sup';
interface TitleBlock extends StyledComponentBase<'h1', DefaultTheme> {
Sup?: typeof Sup;
Description?: typeof Description;
}
const Title: TitleBlock = styled.h1`
/* styling here */
`;
Title.Sup = Sup;
Title.Description = Description;
export default Title;
我的问题是,有没有更好的方法来定义 TitleBlock
元素?