默认情况,自定义组件外部的样式不会污染到自定义组件内部的样式
设置样式隔离的方法:
在组件的options中开启styleIsolation选项
Component({
options:{
styleIsolation: ‘isolated’,//表示样式隔离,默认隔离
},
通过外部样式类允许外部的某个类来影响自定义组件
1.在自定义组件js中添加允许哪个外部类的自定义属性
Component({
externalClasses: [‘my-bg’]
})
2.在引入页面的子组件上添加外部样式类属性
<Dialog my-bg="bg"> </Dialog>
-
在子组件内部添加对应的外部样式类名
<view class="my-bg">xxxx</view>