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;
}
那深度选择器是怎么实现这个效果的呢?
其实就是元素增加样式的时候,没有添加对应的属性选择器