javascript - 如何在 CSS 模块中使用全局父选择器

Question

我在 React 应用程序中使用CSS 模块。我还有一个带有一些全局样式的下拉组件（我很满意，因为我想重复使用的一般样式）。

当下拉菜单处于活动状态时，将应用 CSS 类 ( .dropdown--active)。有没有办法可以在组件的本地范围样式旁边包含该全局类？即，我想要的是这个工作：

.myClass {
  color: red;
}

:global .dropdown--active .myClass {
  color: blue;
}

但是，该语法使整个选择器成为全局的，这不是我所追求的：我希望.myClass将范围限定为组件。

score 24 · Accepted Answer

只需在括号中包含所需的全局类：

:global(.dropdown--active) .myClass {
  color: blue;
}

1 回答 1