小程序 解决原生组件最高层级问题

小程序 解决原生组件最高层级问题

最近接到一个需求，写一个空调的控制页面，有多个空调的选择和控制页面一起运用，如图：
在这里插入图片描述

可是问题出现了，我的下拉列表一直在环形的下一层，我把z-index：999都没有用，后来我百度查了一下，才发现原生组件拥有最高层级，下面我来介绍一下小程序有哪些原生组件：

• camera
• canvas
• input（仅在focus时表现为原生组件）
• live-player
• live-pusher
• map
• textarea
• video

而我的环形图就是运用canvas画出来的，所以无论我在下拉列表怎么设置，都不会在环形图的上层，为了节省多余出现，我就直接上代码了：

在XML中：

//用来展示环形图

//用来展示环形图
<image src="{
  {imagePath}}" class="lucky-index-img"></image>
//自定义环形图
<canvas class="lucky-index-round" canvas-id="circleBar"></canvas>