uniapp的video视频属性打包app后层级过高

问题:在使用uniapp开发APP时,使用video标签显示视频发现H5可以正常展示,但是打包到APP后,它的层级过高,把底部导航都盖住了。

官网说明:uni-app官网

官网给了cover-view组件或plus.nativeObj.view、subNVue三种方案,实行起来有点繁琐,使用我直接使用了现成的插件。

解决方案:video-player 视频播放器 html5视频播放器-解决频层级、覆盖 - DCloud 插件市场

使用方式:

这是一个组件,直接把组件复制到公共的文件夹下,引入就可以直接使用。

javascript 复制代码
<DomVideoPlayer
  ref="domVideoPlayer"
  src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-app-video-courses.mp4"
  autoplay
  loop
  controls
  muted
/>

<script>

import DomVideoPlayer from '@/components/DomVideoPlayer/DomVideoPlayer';
	export default {
		components: {
			DomVideoPlayer
		},
    }
</script>

使用效果:

最后感谢作者大大提供这么好的解决方案!!!

相关推荐
可乐鸡翅yeah_2 小时前
FFmpeg 生成 HLS 独立分片 independent‑segments 参数到底有什么用
javascript·ffmpeg·音视频·safari·m3u8
企业数字化笔记3 小时前
视频理解怎样从“看见”变成“判断”?几何规则、轨迹特征与动作模型的选型
音视频
小猴子爱上树10 小时前
跨马翻译:批量图片翻译+视频字幕+智能抠图,跨境电商在线图片翻译工具
大数据·人工智能·python·音视频
阿明副业观察13 小时前
AI视频创作流程怎么做?完整指南与工具推荐
大数据·人工智能·aigc·音视频·ai写作
aichitang202413 小时前
应用数学与音频信号处理
音视频·信号处理
可乐鸡翅yeah_14 小时前
hls.js 缓冲区参数 maxBufferLength、maxBufferSize 通俗讲解与业务调参
开发语言·javascript·ios·音视频·safari·m3u8
小宋102115 小时前
视频 RAG 从零实现:镜头切分、字幕对齐与时间段引用
人工智能·音视频
Dovis(誓平步青云)15 小时前
导览音频切换太快,旧讲解不能覆盖新展品
android·前端·javascript·ecmascript·音视频·宠物
郑州光合科技余经理1 天前
海外版外卖加盟:总站与分站配送规则怎么分开管
java·开发语言·前端·后端·uni-app·php·ai编程
归秋1421 天前
多轨音频智能混音软件怎么选:从 demo 到更完整作品的 AI 后期工具思路
人工智能·音视频