<template>
<div>
<test />
<test1 />
<test2 />
</div>
</template>
<style scoped>
@import '@/main.css'
</style>
我知道 scoped 不会让父组件的样式泄露给子组件。
但如果我想让import style 泄漏到所有子组件，而不是让它泄漏到全局。
此样式用于所有子组件，但不适用于全局样式。
我发现的方法是在每个子组件中导入样式，但是如果子组件太多，我需要在每个子组件中都导入样式。
有什么办法吗？
【问题讨论】：
/deep/，例如/deep/ .child { .. }
标签： vue.js vue-component
这是我的codesanbox example。
如果您希望scoped 样式中的选择器“深”，即影响子组件，您可以使用>>> 组合器：
父组件：
<template>
<div class="parent">
<test1/>
<test2/>
</div>
</template>
<style scoped>
.parent >>> .child {
// ...
}
</style>
子组件：
<template>
<div class="child"></div>
</template>
上面会编译成：
<div class="parent" data-v-f3f3eg9>
<div class="child"></div>
<div class="child"></div>
</div>
.parent[data-v-f3f3eg9] .child {}
更多deep的使用技巧可以在here找到
【讨论】：
import style 是库，就像引导程序一样，它还有什么方法可以做到吗？我想使用引导程序，但我只希望它的类影响某些组件。