请问如何实现同层渲染，控制原生组件层级

开发工具canvas覆盖了 cover-view，但是手机显示是正常的

<scroll-view scroll-x="true" scroll-y="true" class="canvas-box">
          <canvas type="2d" id="canvas" class="canvas canvas-in" style="height: 630rpx;width: 630rpx;"></canvas>
        </scroll-view>
        <cover-view class="imgs">
          <cover-view class="imgs-box">
            <cover-image class="img" wx:for-items="{{basics.imgUrl}}" wx:key="item" src="{{item.FiledID}}"
              style='{{maxHeight}}'></cover-image>
          </cover-view>
        </cover-view>

.canvas-box {
  width: 100%;
  height: 100%;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  position: relative;
}


.canvas {
  min-width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}


.canvas-in {
  z-index: -1;
}


.canvas-out {
  z-index: 99;
  background-color: #fff;
}


.imgs {
  background-color: #F7F9FC;
}


.imgs-box {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  /* padding: 8rpx; */
  box-sizing: border-box;
}


.img {
  flex-shrink: 0;
  width: 33.3%;
  padding: 5rpx;
  box-sizing: border-box;
}