vue中style后面的scoped的作用


笼统点说,scoped 修饰的style只给当前组件内的元素使用,而通过slot插槽插进来的元素,scoped就管不到了。

本质上,scoped做了两个事情

1.给当前组件中的所有元素,添加一个随机的属性
2.给当前组件中的所有元素的样式添加一个对应的随机属性选择器

PS:如何在有scoped的时候,影响slot元素样式呢?

使用深度选择器
在scss下使用:

      // 深度选择器 scss ::v-deep  less /deep/  css >>>
      ::v-deep .zhf-button:first-child {
        margin-right: 20px;
      }

那深度选择器是怎么实现这个效果的呢?

其实就是元素增加样式的时候,没有添加对应的属性选择器


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM