使用对象声明的样式组件中的媒体查询

Question

我将像 in 这样的样式组件react-native作为js对象编写：

const SectionTitle = styled.div({
  fontSize: '25px',
  display: 'flex',
})

是否可以使用具有上述对象样式的媒体查询？

Answer 1

是的，这是可能的。您只需要用引号将对象键包装起来，就可以从媒体查询规则中形成一个字符串。

例如：

const SectionTitle = styled.div({
  fontSize: '25px',
  display: 'flex',
  '@media(min-width: 788px)': {
    fontSize: '40px'
  }
})