近期有需求，使用video组件播放视频，在使用手机流量的情况下加一层遮罩来提醒，点击按钮关闭遮罩开始播放
类似效果
最好还要加入一行标题，当前正在使用非wifi环境，观看需要使用手机流量
因为前期看过
cover-*的两个组件，这个场景刚好适合，video作为原生组件，层级最高，使用z-index也不能改变叠放cover-view只能嵌套相同cover-*的组件和button
根据以上需求和限制大致的思路如下：
<video src="http://xxx.mp4">
<cover-view>
当前正在使用非wifi环境，观看需要使用手机流量
<button>使用流量播放</button>
</cover-view>
</video>
调整好css后发现，button并不能挡住video组件正中间的播放按钮，对比同类的实现产品，应该是增加了一层遮罩，显示视频预览图，点击播放后消失，于是增加一层cover-image
<video src="http://xxx.mp4">
<cover-view>
当前正在使用非wifi环境，观看需要使用手机流量
<button>使用流量播放</button>
</cover-view>
<cover-image src="http://xxxxx.jpg"></cover-image>
</video>
通过定位将遮罩的图片铺满video组件，但是产生了以下几个bug：
bug1：使用z-index将按钮和标题放在遮罩之上无效
bug2: 编辑器预览正常，但是真机调试后发现图片被cover-view内的标题文字压了下去
在网上大致一搜没有很好的解决方法，cover-view这个组件看来只能够用于一些简单实用的场景，在当前的需求下实现难度很大
解决办法
通过不断对比同类的产品，我发现了一个实现思路：
- 通过
view生成一个跟video等高等宽的块，在view内实现需要的功能，然后再使用wx:if和wx:else去控制提示和视频的显示，可以很轻松的实现想要的效果
这种方法早就应该想到，但是就想着试一试
cover-view，搞得很麻烦
