uniapp中video标签层级过高

在uniapp项目中，如果video标签的层级过高，会导致页面滑动时可能会遮挡顶部导航栏或弹窗效果。解决这个问题可以使用subNVues进行配置。在pages.json文件中，可以通过以下配置来解决这个问题：
{
"path": "pages/index/index",
"style": {
...
}
}

此外，如果要创建一个预览图片并添加点击事件，可以使用以下代码：
<image src="@/static/image/bofang.png" alt="" style="width: 350rpx; height: 280rpx; position: relative;" @click="onIsVideo(videoSrc)">

如果要创建一个用于预览的video标签，可以使用以下代码：
<video :src="onVideoSrc" x5-video-player-type="h5-page" :autoplay='true' v-show="false" style="width: 100vw; height: 100vh;" id="video_play"></video>

另外，在js代码中，可以通过以下代码来处理点击事件并解决视频遮挡的问题：
onIsVideo(src){
// 获取视频地址
this.onVideoSrc = src
// 获取video上下文对象
this.videoContext = uni.createVideoContext('video_play');
// 进入全屏状态
this.videoContext.requestFullScreen();
}
以上是解决uniapp中video标签层级过高问题的方法。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [uniapp video视频层级过高 遮挡顶部导航 页面弹窗 使用原生子窗体解决问题](https://download.csdn.net/download/weixin_42216995/87842998)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [解决 uniapp video视频组件层级过高，预览会覆盖其他组件的问题。](https://blog.csdn.net/haliboti/article/details/121927980)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]