在我的React JS应用程序中，我有一个组件，我想根据一个变量设置移动断点：
1
1567<Component size={'500px'}/>
const Component = ({size}) => {
return (
<div md:flex>hello</div>
)
}
我想要在md:flex的位置上添加类似[size]:flex的东西，以便根据该属性设置断点。（例如：如果大小为500px或100px或900px，则设置为display flex）
问题：是否可以根据我上面描述的方式设置媒体查询？
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
您可以使用classnames npm包：
const rootClassName = cn( // 首先添加任何tailwind classNames "h-full flex flex-col", // 这是条件部分。根据size属性，定义className { [md:flex-1]: size === "A", [sm:flex-1]: size === "B", } )