如何将媒体查询添加到 React CSS 对象？

Question

目前我有这个：

const ButtonStyles = {
    color: 'red',
}

但是我想为移动设备添加一个媒体查询，它看起来像这样吗？:

const ButtonStyles = {
    color: 'red',
    '@media (max-width: 900px)': {
        color: 'blue',
    }
}

如果语法不是这种格式，那么应该怎么做？

Answer 1

根据此 您不能将媒体查询与 React css 对象一起使用。您必须使用带有 class 名称的样式表或其他外部模块，如样式组件。