uni-app 钉钉小程序不支持styleIsolation

uni-app 钉钉小程序不支持styleIsolation

示例代码：

<!-- 视频预览弹窗 -->  
<u-popup v-model="isPreview" mode="center" width="100%">  
    <video :src="videoSrc" @error="videoErrorCallback" :enable-danmu="false" controls></video>  
</u-popup>

操作步骤：

uniapp项目运行到微信小程序和钉钉小程序 但是钉钉小程序不支持styleIsolation配置，导致组件的样式都出问题了
目前发现u-popup等组件样式完全失效

预期结果：

修复编译后能正常识别 uview组件库样式

实际结果：

样式失效

bug描述：

支付宝小程序平台 优化 组件 styleIsolation 默认配置为 apply-shared
但是钉钉小程序不支持styleIsolation配置，导致组件的样式都出问题了
目前发现u-popup等组件样式完全失效

开发环境 版本号 项目创建方式
Windows Windows HBuilderX
HBuilderX 4.15
第三方开发者工具 Version 3.9.22

更多关于uni-app 钉钉小程序不支持styleIsolation的实战教程也可以访问 https://www.itying.com/category-93-b0.html

17 回复

hx 升级到最新版 4.76 试试还有没有问题

更多关于uni-app 钉钉小程序不支持styleIsolation的实战教程也可以访问 https://www.itying.com/category-93-b0.html


目前已经降低版本 到3.5.3 还在测试当中

不是说3.99 已经修复了吗 为什么 4.15版本还存在这个问题

测试后发现3.5.3 没用

回复 1***@163.com: 钉钉小程序原生就不支持 styleIsolation

回复 DCloud_UNI_JBB: 那就是钉钉上的所有用到uview这个组件库的全部要替换掉成条件编译写法吗

回复 1***@163.com: 你现在的问题不是样式冲突问题吗？跟条件编译啥关系，哪个配置有没有也都不影响

回复 DCloud_UNI_JBB: 就是样式上他不生效啊 u-popup这个写法运行到微信开发者工具是好的 运行到钉钉开发者工具 是不生效的

回复 1***@163.com: 那你条件编译吧

回复 DCloud_UNI_JBB: 这个有没有其他什么方案能解决的 我这个组件库很多组件要是封装全部条件编译 相当于重新写一遍了 工作量非常大

回复 1***@163.com: 你先尝试给uviewui的组件的style哪里加个scoped

回复 1***@163.com: 加scoped有用吗？

回复 DCloud_UNI_JBB: 没作用 直接条件编译 手撸

这个是 目前的样式

请问最后怎么解决的？我也遇到这个问题了

条件编译 手撸

钉钉小程序确实不支持styleIsolation配置，这会导致组件样式隔离失效。针对uView组件库样式问题，建议采用以下解决方案：

  1. 全局样式覆盖：在App.vue中引入uView样式文件
@import 'uview-ui/index.scss';
  1. 组件级样式穿透：在具体页面中使用深度选择器
::v-deep .u-popup {
  /* 自定义样式 */
}

  1. 检查样式引入顺序：确保uView样式在项目样式之前引入

  2. 条件编译：针对钉钉平台单独处理样式

/* #ifdef MP-DINGTALK */
  .custom-style {}
/* #endif */
回到顶部