原生组件 live-pusher, live-player在某些厂商(例如:华为)Android版本手机微信小程序开发中,使用真机调试的方式进行页面布局时, 因为原生组件(pusher, player, video, camera...)层级最高, 使得其他view无法盖在原生组件上
根据微信小程序官方文档
https://developers.weixin.qq.com/miniprogram/dev/component/native-component.html
原生组件的使用限制
由于原生组件脱离在 WebView 渲染流程外,因此在使用时有以下限制:
原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index
为多少,都无法盖在原生组件上。
后插入的原生组件可以覆盖之前的原生组件
经过测试,为小程序bug, 此问题只是影响到部分android手机的【真机调试】模式; 在【预览】【正式发布】版本中可以原生组件依然可以按照 z-index设定的层级进行正常呈现。
开发建议: 1. 调试呼叫页面时候,如果需要其他view盖在原生组件上,使用iOS版本或者小米手机(例如小米10)进行真机调试测试
2. 呼叫页面原生组件使用区域小窗口呈现, 其他内容不去覆盖原生组件区域
本人测试手机型号 mate 30 pro
index.js:34 LIO-AN00
index.js:35 3
index.js:36 392
index.js:37 689
index.js:38 zh_CN
index.js:39 7.0.21
index.js:40 android
index.js:41 2.14.1