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

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

官网说明:uni-app官网

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

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

使用方式:

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

<DomVideoPlayerref="domVideoPlayer"src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni-app-video-courses.mp4"autoplayloopcontrolsmuted
/><script>import DomVideoPlayer from '@/components/DomVideoPlayer/DomVideoPlayer';export default {components: {DomVideoPlayer},}
</script>

 使用效果:

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/58512.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

考研资料分享系统的设计与实现(lw+演示+源码+运行)

摘 要 互联网发展至今&#xff0c;无论是其理论还是技术都已经成熟&#xff0c;而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播&#xff0c;搭配信息管理工具可以很好地为人们提供服务。针对高校教师成果信息管理混乱&#xff0c;出错率高&#xff0c;信息安全…

[perl] 数组与哈希

数组变量以 符号开始&#xff0c;元素放在括号内 简单举例如下 #!/usr/bin/perl names ("a1", "a2", "a3");print "\$names[0] $names[0]\n"; print "size: ",scalar names,"\n";$new_names shift(names); …

项目符合行业安全标准的必要步骤与实用建议

要保障项目符合行业安全标准&#xff0c;关键在于建立全面的安全管理体系、定期进行风险评估、持续培训员工&#xff0c;以及确保合规性文件和审核流程完整。例如&#xff0c;通过建立合规文件和审核流程&#xff0c;可以系统性地跟踪项目的安全实践和合规性&#xff0c;使安全…

小米15和小米15 Pro区别没那么大,但也得看准再下手

小米15和小米15 Pro区别大总结 接下来&#xff0c;我们将从关键差别等多个方面来分析两个机型的具体区别&#xff08;Ps&#xff1a;只聊不一样的&#xff0c;没提到就是一样的&#xff09;&#xff1a; 关键差别 • 屏幕素质&#xff1a;小米15采用的是6.36英寸1.5K&#xf…

【科研绘图】3DMAX管状图表生成插件TubeChart使用方法

3DMAX管状图表生成插件TubeChart&#xff0c;一款用于制作3D管状图表的工具。可以自定义切片的数量以及随机或指定切片颜色。 【版本要求】 3dMax 2008及更高版本 【安装方法】 TubeChart插件无需安装&#xff0c;使用时直接拖动插件脚本文件到3dMax视口中打开即可&#xff0…

力扣hot100-->递归/回溯

目录 递归/回溯 1. 17. 电话号码的字母组合 2. 22. 括号生成 3. 39. 组合总和 4. 46. 全排列 5. 78. 子集 递归/回溯 1. 17. 电话号码的字母组合 中等 给定一个仅包含数字 2-9 的字符串&#xff0c;返回所有它能表示的字母组合。答案可以按 任意顺序 返回。 给出数字到…

服务器端请求微信登陆授权接口一直超时问题

环境&#xff1a; 服务器系统&#xff1a;centos 7.2 站点环境&#xff1a;nginx 遇到问题&#xff1a; 1、微信小程序端请求服务器登陆接口&#xff0c;服务端收到请求后向微信接口服务器请求数据&#xff0c;请求成功后返回数据给客户端&#xff0c;但是请求微信接口服务器经…

NVR批量管理软件/平台EasyNVR多个NVR同时管理支持对接阿里云、腾讯云、天翼云、亚马逊S3云存储

随着云计算技术的日益成熟&#xff0c;越来越多的企业开始将其业务迁移到云端&#xff0c;以享受更为灵活、高效且经济的服务模式。在视频监控领域&#xff0c;云存储因其强大的数据处理能力和弹性扩展性&#xff0c;成为视频数据存储的理想选择。NVR批量管理软件/平台EasyNVR&…

基于PHP的http字段查询与注册(V1)(持续迭代)

目录 版本说明&#xff1a; 实现环境&#xff08;WAMP&#xff09;&#xff1a; 数据库链接 查询页面 php处理逻辑 字段添加 版本说明&#xff1a; 该查询功能以查询http首部字段为目的实现的字段属性、字段内容的查询&#xff0c;以及对新字段信息的数据注册。 v1实现…

【面试经典150】day 9

目录 1.Z 字形变换 2.找出字符串中第一个匹配项的下标 3.文本左右对齐 1.Z 字形变换 class Solution {public String convert(String s, int numRows) {//明明是N字形变换if(numRows<2) return s;//rows是可扩展的字符串数组List<StringBuilder>rowsnew ArrayLi…

代码随想录 | Day36 | 动态规划 :整数拆分不同的二叉搜索树

代码随想录 | Day36 | 动态规划 &#xff1a;整数拆分&不同的二叉搜索树 动态规划应该如何学习&#xff1f;-CSDN博客 动态规划学习&#xff1a; 1.思考回溯法&#xff08;深度优先遍历&#xff09;怎么写 注意要画树形结构图 2.转成记忆化搜索 看哪些地方是重复计算…

TCP丢包,连接机制,滑动窗口解析

面向字节流 如何理解面向字节流&#xff1f; 发送缓冲区&#xff0c;我们将它当做char类型的数组&#xff0c;当发送时他们的发送序号就可以从他们的下标来获取&#xff0c;接受缓冲区也是char数组&#xff0c;再一个一个字节的向上层读取。 如何理解流动的概念 我们的报文中…

前端开发设计模式——观察者模式

目录 一、定义和特点 1. 定义 2. 特点 二、实现方式 1. 使用 JavaScript 实现观察者模式的基本结构 2. 实际应用中的实现示例 三、使用场景 1. 事件处理 2. 数据绑定 3. 异步通信 4. 组件通信 四、优点 1. 解耦和灵活性 2. 实时响应和数据一致性 3. 提高代码的可…

少儿编程学习中的家庭支持:家长角色如何从监督到参与?

随着少儿编程教育的普及&#xff0c;越来越多的家庭开始意识到编程对孩子未来发展的重要性。编程不仅仅是一项技术技能&#xff0c;更是培养逻辑思维、解决问题能力和创新意识的有效途径。然而&#xff0c;如何在家庭中正确支持孩子的编程学习&#xff0c;对家长而言是一个新的…

EJB项目如何升级SpringCloud

记录某金融机构老项目重构升级为微服务过程1 如何从EJB架构拆分微服务 这个非常有趣的过程&#xff0c;整个过程耗时大致接近半年时光&#xff0c;需要考虑到重构升级保留原来的业务线&#xff0c;而且还要考虑后续的维护成本&#xff0c;保留现有的数据库表结构&#xff0c;…

基于SpringBoot的在线医疗问答平台

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、Vue项目源码、SSM项目源码、微信小程序源码 精品专栏&#xff1a;…

如何使用 Python 操作数据库

&#x1f600;前言 在现代编程中&#xff0c;Python 的数据库操作已广泛应用于各类项目中&#xff0c;例如数据分析、Web 开发和数据持久化存储等。本文将介绍 Python 操作数据库的核心步骤&#xff0c;涉及数据库连接对象、游标对象的使用&#xff0c;以及常见的 SQL 数据操作…

夸克浏览器的用户反馈如何提交

夸克浏览器凭借其简洁的界面、强大的功能以及不断优化的用户体验&#xff0c;赢得了众多用户的青睐。然而&#xff0c;任何产品都不可能完美无缺&#xff0c;用户的反馈对于产品的持续改进至关重要。本文将详细介绍如何在夸克浏览器中高效提交用户反馈&#xff0c;帮助开发者更…

【移动应用开发】使用多媒体--通知/播放音频/视频

目录 一、具体步骤 二、运行截图 1. 开启通知权限 2. 播放音乐 3. 播放视频 三、源代码 1. activity_main.xml 2. activity_video_player.xml 3. activity_notification.xml 4. 一些配置 5. MainActivity 6. VideoPlayerActivity 7. NotificationActivity 8. And…

VulnHub-Brainpan1 靶机笔记

Brainpan1 靶机笔记 概述 靶机地址&#xff1a;https://vulnhub.com/entry/brainpan-1,51/#download 这台靶机是很好的缓冲区溢出漏洞利用的练习靶机&#xff0c;涉及到逆向和缓冲区溢出漏洞挖掘的一些知识。 一、nmap 扫描 1&#xff09;端口扫描 nmap -sT --min-rate 1…