ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

uniapp vue3 小程序 实现样式穿透

uniapp vue3 小程序 实现样式穿透

 

html部分:

在微信小程序无效,它要求:deep或/deep/前面必须还要有父元素的类名存在

<view class="month-btn">
<u-button>月落</u-button>
</view>

js部分:

vue3写法

defineOptions({
options:{
styleIsolation: 'shared'
}
})/**重点,必须加*/

vue2写法

export default
{
// 解除子组件样式隔离
options
: {
styleIsolation: 'shared'
},

}

style部分:

.month-btn{
::v-deep{
.u-size-default{
background-color: red !important;
}
}
}

返回列表