需求 ： 在带有 scoped 属性的 style 中书写样式时，无法作用影响到子组件中的样式，此时我们会使用到 deep 深度选择器，来解决此问题，我们在使用 less 预处理器，能正常使用，但是在 scss 预处理器中会报错。

错误代码：

<style lang="scss" scoped>
     /* 这种写法就会报错 */
     /* 原因：>>>是深度选择器，可以作用到子组件中的样式，/deep/和::v-deep都是>>>的别名，在scss中不识别/deep/,因此报错*/
    /deep/ .el-menu .el-menu-item {
      background-color: #000!important;
    }
</style>

解决方案：

/* 采用:;v-deep就可以解决上述问题 */
<style lang="scss" scoped>
::v-deep .el-menu .el-menu-item {
 background-color: #000!important;
}
</style>

总结
在 vue 中，>>> 是深度选择器，可以作用到子组件中的样式，/deep/ 和 ::v-deep 都是 >>> 的别名，在 scss 中不识别 /deep/, 可以使用 ::v-deep

————————————————
版权声明：本文为CSDN博主「小李在进阶」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_44900104/article/details/126164236