cover-view必须作为video的直接子节点，否则无效；不支持嵌套、复杂css及表单组件；video需关闭controls并慎用autoplay；swiper中应使用v-if而非v-show管理视频实例。
cover-view必须写在<video></video>内部，否则无效
很多开发者第一次尝试用 cover-view 覆盖视频时，习惯性把它和 <video></video> 并列写在页面里，结果发现按钮还是被遮住。根本原因是：微信小程序要求 cover-view 必须作为 <video></video> 的**直接子节点**，否则它压根不会被渲染到视频图层之上。
错误写法：
<video src="xxx.mp4"></video><br><cover-view class="btn">播放</cover-view>
这种结构下，
cover-view 仍属于 WebView 层，层级天然低于原生 <video></video>。正确写法必须是：
<video src="xxx.mp4"><br><cover-view class="btn">播放</cover-view><br></video>
注意：
- cover-view 不支持嵌套其他 cover-view 或 cover-image
- 它只接受有限的 CSS 属性，比如 top、left、width、height、background-color，但不支持 transform、z-index（本身就在顶层）
- 所有交互事件（如 @click）可以直接绑定，但不能用 v-model 绑定表单值
video组件的controls和autoplay要慎用
小程序里开启 controls="true" 后，原生控制栏会强制覆盖整个视频区域，且无法通过 cover-view 精准覆盖——你写的按钮可能被控制栏“吃掉”或错位。同样，autoplay 在部分安卓机上会触发额外的原生图层重绘，加剧层级抖动。
建议：
- 自定义 UI 控制层，统一关闭原生控件：:controls="false"
- 播放逻辑用 ref + play() / pause() 手动控制
- autoplay 改为用户首次点击后触发，避免真机启动时图层抢占冲突
- 若必须自动播放，加上 muted="true"，否则 iOS 微信会拦截静音外的自动播放
swiper里混排video时，用v-if替代v-show
在轮播组件中同时存在多个 <video></video> 时，如果只用 v-show 切换显隐，所有视频实例其实仍在 DOM 中，原生图层持续占用资源，容易引发安卓机型画面撕裂、切换卡顿甚至白屏。
正确做法是：
- 当前项用 v-if="currentIndex === 0" 渲染 video
- 其他项用 v-if="currentIndex !== 0" 渲染 image 或纯 view
- 配合 ref 在切换前调用 videoRef.pause() 和 videoRef.src = ''，释放原生资源
- 注意：v-if 会导致 video 重新加载，若需保持播放进度，得自己缓存 currentTime 并在 onTimeUpdate 中更新
cover-view不支持复杂布局，简单交互才可靠
cover-view 是微信为解决原生组件覆盖问题提供的“轻量级方案”，不是万能容器。它不支持 Flex 布局、不支持伪元素、不支持背景渐变、不支持文字换行（white-space: normal 失效），更没法嵌套 input 或 picker。
适用场景仅限于：
- 文字提示、状态标签（如“直播中”、“已暂停”）
- 单击按钮（播放/暂停/全屏）
- 静态图标（用 cover-image）
- 简单进度条（靠多个 cover-view 拼接）
一旦需要表单输入、下拉选择、弹窗联动，就得放弃 cover-view，改用 subNVue（App端）或服务端生成静态图+canvas 替代（小程序端）。这点容易被忽略——很多人硬扛着用 cover-view 做登录框，最后发现输入框根本点不进去。
