javascript - 样式化的组件-共享CSS

我的风格如下：

export const oneLine = styled.style`
    white-space: nowrap;
`

我试图在这样的样式化组件内部使用它：

const Foo = styled.div`
    ${oneLine}
    ...
`

但是，没有应用样式。为什么是这样？

提到了使用styled.css的其他答案，但不再存在。

最佳答案

不用styled.style而是使用css：

import { css } from 'styled-components'

export const oneLine = css`
    white-space: nowrap;
`

其他档案：

const Foo = styled.div`
    ${oneLine}
    ...
`