深度作用选择器

126 阅读1分钟

scoped的样式,希望影响到子组件的默认样式

在样式中设置完scoped在浏览器解析为如下图这样,a是个div,a div里面包含一个组件里面解析完了div的样式名字为b,想在父组件影响到子组件的默认样式。

  <style scoped>
    .a >>> .b { /* ... */ }
  </style>
  
  
 
    
    
  <style scoped lang=“scss”>
    .a /deep/ .b { /* ... */ }
  </style>

官网这样说的

就是说有些像Sass之类的预处理器无法正确解析>>>。这种情况下你可以使用/deep/或者::v-deep 操作符取而代之,这是一个>>>的别名,同样可以正常工作。

<style scoped>

  外层 >>> 第三方组件 {

      样式

  }

/deep/  第三方组件 {

      样式

  }

</style>

扫码加群