项目场景:uniapp(微信小程序端)强制修改组件样式,使用::v-deep不生效(解决办法)
提示:这里简述项目相关背景:
在开发好了app需要兼容成微信小程序版本,发现有些UI组件样式修改不生效,网上搜索相关问题后进行解决。
问题描述
提示:这里描述项目中遇到的问题:
在使用uniapp开发微信小程序时发现了,使用uview-plus自定义不了样式,对样式也使用了::v-deep也无效。


原因分析:
提示:这里填写问题的分析:
在微信小程序平台上。这是因为微信小程序对于组件样式的处理具有一定的隔离性,旨在防止样式冲突,这被称为样式隔离。
styleIsolation 是一个uni-app提供的配置项,用于控制组件样式的作用域。它有几个可选值:
isolated 表示启用样式隔离,在自定义组件内外,使用 class 指定的样式将不会相互影响(一般情况下的默认值);
apply-shared 表示页面 wxss 样式将影响到自定义组件,但自定义组件 wxss 中指定的样式不会影响页面;
shared 表示页面 wxss 样式将影响到自定义组件,自定义组件 wxss 中指定的样式也会影响页面和其他设置了 apply-shared 或 shared 的自定义组件
解决方案:
提示:这里填写该问题的具体解决方案:
使用styleIsolation属性来解决小程序样式隔离