如何根据全局选择器添加范围样式

【问题标题】：How to add scoped styles depending on a global selector如何根据全局选择器添加范围样式
【发布时间】：2020-08-26 11:02:48
【问题描述】：

所以 Vue 有 >>> 和 /deep/ 用于在作用域样式中设置子组件的样式：

<style scoped>
.local-class-name >>> .class-name-of-nested-component {
    ...
}
</style>

但我需要的是不同的。如何根据全局类名使用作用域样式设置组件样式？像这样：

<style scoped>
.global-class-name .local-class-name {
    ...
}
</style>

提前谢谢你！

【问题讨论】：

标签： css vue.js

【解决方案1】：

我没有注意到它只是在选择器的最后部分添加了一个 data 属性。

所以上面的例子已经可以工作了，因为它被编译为下一个代码：

.global-class-name .local-class-name[data-v-ab5212] {
    ...
}

【讨论】：