0

React JSS 样式语法中的当前元素选择器是否有等效的工作?

'&element': { margin: 0 }

用例

<Button>我的应用程序中的所有组件都有这种风格。

'&:first-of-type': { marginLeft: 0 },
'&:last-of-type': { marginRight: 0 }

因此,如果它们连续出现,则第一个和最后一个具有适当的边距。

但是,有时我使用

<Button component={Link} ../>

这会将Buttoncomponent 变成aelement 而不是button. 这可能会弄乱:first-of-type/:last-of-type选择器并取消a按钮之间元素的边距。

我的初衷是设置这样的东西,但这不起作用。

'&button:first-of-type': { marginLeft: 0 },
'&button:last-of-type': { marginRight: 0 }

到目前为止,我正在使用替代方案

'&:first-of-type:not(a)': { marginLeft: 0 },
'&:last-of-type:not(a)': { marginRight: 0 }
4

1 回答 1

1

按钮元素不应该负责边距,因为它破坏了封装,你的组件不应该照顾外层空间,它的父级应该是。

于 2021-03-30T14:20:22.393 回答