解决uniapp视频video组件进入全屏再退出全屏后,cover-view失效的问题

给cover-view一个变量如isCloseBtnShow,通过v-if(不要用v-show)来控制显示隐藏。监听video全屏事件,全屏时,设置变量为false,退出全屏时再设为true,这样每次退出全屏,cover-view会重新加载。被覆盖的问题就解决了。

<video class="videoShowStyle" id="myVideo" :src="videoUrl" @fullscreenchange="playerFullScreen"@error="videoErrorCallback" @click="closeVideo" controls><cover-image v-if="isCloseBtnShow" class="videoClose" @click="goback"src="/static/icon/popupClose.png"></cover-image></video>
data() {return {isCloseBtnShow: true,}
},
playerFullScreen(e) {if (e.detail.fullScreen) { //全屏this.isCloseBtnShow = false} else { //非全屏			this.isCloseBtnShow = true}
},

 

 

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

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

相关文章

初识模版!!

初识模版 1.泛型编程1.1 如何实现一个交换函数呢&#xff08;使得所有数据都可以交换&#xff09;&#xff1f;1.2 那可以不可以让编译器根据不同的类型利用该模子来生成代码呢&#xff1f; 2.模版类型2.1 模版概念2.2 函数模版的原理2.3 函数模板的实例化2.4 模板参数的匹配原…

如何优化前端页面的 AJAX 请求性能并避免冲突

个人名片 🎓作者简介:java领域优质创作者 🌐个人主页:码农阿豪 📞工作室:新空间代码工作室(提供各种软件服务) 💌个人邮箱:[2435024119@qq.com] 📱个人微信:15279484656 🌐个人导航网站:www.forff.top 💡座右铭:总有人要赢。为什么不能是我呢? 专栏导…

开源 AI 智能名片 S2B2C 商城小程序与正能量融入对社群归属感的影响

摘要&#xff1a;本文探讨了开源 AI 智能名片 S2B2C 商城小程序在社群运营中的作用&#xff0c;以及融入正能量对提高社群归属感的关键意义。通过分析正能量的精神感染力和对社群氛围的积极影响&#xff0c;阐述了在开源 AI 智能名片 S2B2C 商城小程序的各类活动中融入正能量的…

flask项目初始化

1、初始环境 python3.8 2、flask文档地址&#xff1a;https://flask.palletsprojects.com/en/latest/installation/#install-flask 3、初始化项目 $ mkdir myproject $ cd myproject $ python3 -m venv .venv $ . .venv/bin/activate $ pip install Flask4、打开项目mypr…

Ansible——Playbook基本功能???

文章目录 一、Ansible Playbook介绍1、Playbook的简单组成1&#xff09;“play”2&#xff09;“task”3&#xff09;“playbook” 2、Playbook与ad-hoc简单对比区别联系 3、YAML文件语法&#xff1a;---以及多个---&#xff1f;&#xff1f;使用 include 指令 1. 基本结构2. 数…

java后端字节一面

1. 我现在和你进行视频通话&#xff0c;这个是怎么做的&#xff1f; 视频通话通常基于实时通信技术&#xff08;RTC&#xff09;&#xff0c;如WebRTC。它利用现代浏览器的API来实现视频、音频和数据的直接P2P&#xff08;点对点&#xff09;通信&#xff0c;或通过服务器中转。…

【JavaEE】IP协议 应用层协议

&#x1f525;个人主页&#xff1a; 中草药 &#x1f525;专栏&#xff1a;【Java】登神长阶 史诗般的Java成神之路 &#x1f576;️一.IP地址 IP协议&#xff08;Internet Protocol&#xff09;是TCP/IP协议族中最核心的协议之一&#xff0c;它定义了数据包在网络中传输的标准…

应用层协议HTTP介绍

一、HTTP协议介绍 HTTP&#xff08;HyperText Transfer Protocol&#xff0c;超文本传输协议&#xff09;是一个至关重要的协议。它定义了客户端&#xff08;如浏览器&#xff09;与服务器之间如何通信&#xff0c;以交换或传输超文本。 超文本&#xff1a;视频&#xff0c;音…

24年蓝桥杯及攻防世界赛题-MISC-1

2 What-is-this AZADI TOWER 3 Avatar 题目 一个恐怖份子上传了这张照片到社交网络。里面藏了什么信息?隐藏内容即flag 解题 ┌──(holyeyes㉿kali2023)-[~/Misc/tool-misc/outguess] └─$ outguess -r 035bfaa85410429495786d8ea6ecd296.jpg flag1.txt Reading 035bf…

深度学习——管理模型的参数

改编自李沐老师《动手深度学习》5.2. 参数管理 — 动手学深度学习 2.0.0 documentation (d2l.ai) 在深度学习中&#xff0c;一旦我们选择了模型架构并设置了超参数&#xff0c;我们就会进入训练阶段。训练的目标是找到能够最小化损失函数的模型参数。这些参数在训练后用于预测&…

AOP-前置原理-怎么判断和拦截?

判断模式 类型&#xff08;Class&#xff09;方法&#xff08;Method&#xff09;注解 &#xff08;Annotation&#xff09;参数 &#xff08;Parameter&#xff09;异常 &#xff08;Exception&#xff09; public class TargetFilterDemo {public static void main(String[…

项目(石头剪刀布游戏双循环)

while (true) { #region 猜拳游戏主题逻辑 // 定义猜拳次数 int count 3; //定义用户赢得次数 int winCount 0;// 初始值为零表示用户一次没饿赢 int sysCou…

如何使用命令行快速下载Google Drive/OneDrive大文件

OneDrive OneDrive使用wget下载会出现403 forbidden&#xff0c;可通过下面方法下载。 浏览器右键进入检查界面&#xff0c;选择netowork&#xff0c;搜索download.aspx&#xff0c;然后在待下载文件处点击下载&#xff0c;即可出现下载链接&#xff0c;复制为cURL即可下载。…

数据结构与算法-Trie树添加与搜索

trie树的使用场景 我们若需要制作一个通讯录的软件&#xff0c;使用常规树结构查询的复杂度为O(logn),但trie树的复杂度确与数据多少无关&#xff0c;与单词长度有关&#xff0c;这就大大缩减的查询的时间复杂度。 trie树的基本实现 基础结构 package com.study.trieDemo;i…

日志收集工具 Fluentd vs Fluent Bit 的区别

参考链接&#xff1a; FluentdFluentd BitFluentd & Fluent Bit | Fluent Bit: Official Manual Fluentd 与 Fluent Bit 两者都是生产级遥测生态系统&#xff01; 遥测数据处理可能很复杂&#xff0c;尤其是在大规模处理时。这就是创建 Fluentd 的原因。 Fluentd 不仅仅是…

Java List sort() 排序

sort是java.util.List接口的默认方法。 List的排序方法在Java 8中被引入。 排序方法接受比较器作为参数&#xff0c;并根据指定的比较器对这个列表进行排序。 default void sort(Comparator<? super E> c) 示例代码&#xff1a; import java.text.Collator; import …

jenkins声明式流水线语法详解

最基本的语法包含 pipeline&#xff1a;所有有效的声明式流水线必须包含在一个 pipeline 块中stages&#xff1a;包含一系列一个或多个stage指令stage&#xff1a;stage包含在stages中进行&#xff0c;比如某个阶段steps&#xff1a;在阶段中具体得执行操作&#xff0c;一个或…

Eclipse 编译项目

Eclipse 编译项目 Eclipse 是一个广泛使用的集成开发环境(IDE),它支持多种编程语言,包括 Java、C/C++ 和 Python。在 Eclipse 中编译项目是一个基本但重要的过程,确保代码的正确性和运行效率。本文将详细介绍在 Eclipse 中编译项目的步骤,包括配置、常见问题及其解决方案…

极狐GitLab CI/CD 功能合集(超详细教程)

极狐GitLab 是 GitLab 在中国的发行版&#xff0c;专门面向中国程序员和企业提供企业级一体化 DevOps 平台&#xff0c;用来帮助用户实现需求管理、源代码托管、CI/CD、安全合规&#xff0c;而且所有的操作都是在一个平台上进行&#xff0c;省事省心省钱。可以一键安装极狐GitL…

React js Router 路由 2, (把写过的几个 app 组合起来)

完整的项目&#xff0c;我已经上传了&#xff0c;资源链接. 起因&#xff0c; 目的: 每次都是新建一个 react 项目&#xff0c;有点繁琐。 刚刚学了路由&#xff0c;不如写一个 大一点的 app &#xff0c;把前面写过的几个 app, 都包含进去。 这部分感觉就像是&#xff0c; …