如题,近期开始使用uni-app开发小程序,过程中虽然也遇到不少问题,但是popup在开发者工具不会弹出这个问题着实恶心到我了,开发者工具出不来,预览或者真机调试正常,来来回回下不同版本插件,升级开发者工具都不能完全解决这个问题,目前找到个折中方案
省流:
微信开发者工具(两个方法都可以解决):
- 切换基础库
- 删除
uni-transition包重新导入
支付宝开发者工具:
- 删除
uni-transition包重新导入
- popup version
- 原因
具体原因可能是在开发者工具中poput包裹内容没有传进popup组件的slot中,故经常报slot空 (我猜的,看了源码表示看不出什么问题)
- 解决方案
-
弹窗出不来了就去切一下基础库,随便切,本人实测基本切完弹窗都能出来
最新发现直接基础库切低一点就不会有啥问题了,比如最新的是2.25.0 , 我用2.16.0弹窗就很稳定
-
删除components中的uni-popup插件或者uni-translate插件,用hbuilder重新导入
这个比较麻烦,效果也不好,也可能重新下了包还是出不来
-
重启开发者工具,这个是百度出来的方案,但是我一次都没成功过
- popup的坑
- 底部安全区域背景色,默认为透明 , 修改颜色可以使用
background-color="#fff"
- 坑爹问题: 修改背景色会导致popup内部元素圆角被遮盖
- 原因
如图,将背景色调整为绿色之后可以看到圆角后面还有绿色区域,假如我们popup背景色跟内容区域颜色一样,弹窗内容区域背景色和popup背景就会重合 , 最后看起来就像圆角失效了
- 解决方案
具体调试过程就不多解释了,必须修改popup源码两个地方才能实现(这里我这边小程序popup样式统一了,可以直接源码里面改)
- 修改uin-popup bg 相关样式
下图代码在uin-popup 29行
- 修改bottom函数的transClass , 这个style用于主要在这里起作用