aphrodite中的class >元素选择器

Question

如何在aphrodite中实现>元素选择器。我想设置我的孩子div的宽度为"100%“

 inputContainer: {
        width: '100%',
        "> div": {
            width: '100%'
        }
    },

但它不起作用。

Answer 1

这有点像黑客的变通方法，但我相信这应该适用于Aphrodite：

    ':nth-child(1n) > div': {
      width: '100%'
    },

它之所以有效，是因为如果规则以":“开头，Aphrodite基本上会将任何逐字转置到它创建的样式标记中。

Answer 2

请改用AphroditeJSS。它使用与Aphrodite相同的API，并解决了Aphrodite的一些缺点，后代样式就是其中之一。

https://github.com/cssinjs/aphrodite-jss

npm i aphrodite-jss --save-dev

​

const inputCss = Stylesheet.create = ({
    inputContainer: {
        width: '100%',
        "> div": {
            width: '100%'
        }
    },
});

​

Answer 3

Aphrodite不支持嵌套元素样式。我建议使用样式组件或魅力组件。