reactjs - 如何在样式组件中使用 className 两次？

Question

const Box = styled.div`
    display:flex;
    width:1024px;
`;

<Box>Test</Box>

- 结果

我想要的结果如下。

如何在样式组件中使用 className 两次？

标签： reactjsstyled-components

Answer 1

你不能。样式化的组件类名是自动生成的。可能有一个黑客来实现这一点，但这不是预期的方式。

您可以通过导出它在多个地方使用 Box 组件

export const Box = styled.div`
    display:flex;
    width:1024px;
;`

并在其他组件中重用它。这也是主要的 React 范例。尽可能重用组件。