-
需求
需要解决下方图中的问题,当底部弹出弹出框时,需要除弹出框外的元素置为透明灰色。下图是真机效果。
此时,echarts图表依旧高亮显示,需要去掉该高亮效果。
下图是微信开发者工具效果,开发者工具显示正常,真机echarts图表则会高亮。
-
问题所在
通过微信小程序Echarts覆盖正常组件问题解决该文章知道:Echarts使用的是微信原生canvas,优先级高,z-index完全无效。cover-view 可以覆盖在原生组件之上。 -
解决方式
将写弹出层使用的 view 组件全部替换成 cover-view 组件
<view class="chartsBox"></view> <view class="listBox"> <view bindtap="showModel">更多指标</view> </view> <cover-view class='{ {bg}}' style="display:{ { backgroundVisible ? 'block':'none'}}"></cover-view> <cover-view class="element-wrapper" animation="{ {animation}}" style="display:{ { show ? 'block':'none'}}"> <cover-view class="element"> <cover-view class='picker_header'> <cover-view class="right-bt" catchtap="hidden">关闭
微信小程序中当底部弹出框时,背景色置透明灰并覆盖echarts图表
最新推荐文章于 2024-08-15 23:03:45 发布