反应根据条件获取样式化的组件

Question

我正在尝试将我的项目更改为专用样式组件使用。我在

<div className={isGrid ? "card-grid" : "card-list"}>

我的div根据条件获取卡片网格或卡片列表类名称。我将如何使用样式化组件和没有 css 文件来实现这一点？ 我还需要类名始终低于 600px (@media( 的卡片网格

Answer 1

在样式化组件中，您可以使用${prop => prop.isGrid}来呈现该逻辑。对于媒体查询，您也可以在样式化组件中使用常规查询。