vue添加监听页面未操作倒计时-跳转页面

1、声明定时器变量

countDown: 120,
countDownTimer: null,

2、倒计时函数

    // 倒计时countDownFun() {this.countDownTimer = setInterval(() => {this.countDown -= 1;if (this.countDown <= 0) {clearInterval(this.countDownTimer);this.countDownTimer = null;localStorage.clear();sessionStorage.clear();this.$router.push('/zhuhaiHome');}}, 1000);},

3、生命周期挂载倒计时方法

  created() {this.countDownFun();},mounted() {// 监听全局点击事件 点击后重新计算倒计时const that = this;document.body.onclick = function () {clearInterval(that.countDownTimer);that.countDown = 120;that.countDownFun();};},

4、离开页面前清除定时器

  beforeDestroy() {if (this.countDownTimer) {clearInterval(this.countDownTimer);this.countDownTimer = null;}},

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

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

相关文章

SpringBoot学习笔记一、SpringBoot应用初创建以及应用

一、创建SpringBoot的两种方式 1.Spring Initializr方式创建 &#xff08;1&#xff09;第一步在IDEA中选择 File-->NEW-->Project &#xff0c;选择 Spring Initializr &#xff0c;指定Maven坐标、包名、指定 JDK 版本 1.8 &#xff0c;然后点击Next 。如下图&#x…

AcWing 1247.后缀表达式

思路&#xff1a;贪心 由题目中我们可以知道&#xff0c;我们需要计算的是一个后缀表达式&#xff0c;要求尽可能的运算出最大的数。它给了我们加号和负号&#xff0c;让我们自己安排需要怎么做。 其实这里涉及到一个小学的知识点&#xff0c;也就是在括号遇到负号的时候&…

配置文件 application properties

配置文件 application properties 1 参数交由配置文件集中管理 Value(“${}”)用于外部配置的属性注入 在之前编写的程序中进行文件上传时&#xff0c;需要调用AliOSSUtils工具类&#xff0c;将文件上传到阿里云OSS对象存储服务当中。而在调用工具类进行文件上传时&#xff0c…

tensorflow安装以及在Anaconda中安装使用

在遥感领域进行深度学习时&#xff0c;通常使用python进行深度学习&#xff0c;会使用到tensorflow的安装&#xff0c;今天小编就给大家介绍如何在Anaconda中安装tensorflow&#xff01; 下载Anaconda Index of /anaconda/archive/ | 清华大学开源软件镜像站 | Tsinghua Open…

文件服务: 功能介绍

文章目录 一、需求背景二、核心功能1、功能要求2、非工能要求 三、存储方式四、实现方式五、技术栈说明 一、需求背景 二、核心功能 1、功能要求 文件上传文件预览文件分片上传文件分片合并文件秒传文件断点续传文件下载 2、非工能要求 高扩展性&#xff1a;方便添加新的存…

浮动布局与定位布局

目录 前言: 浮动布局&#xff08;Float Layout&#xff09;: 定位布局&#xff08;Positioning Layout&#xff09;: 1.传统布局: 1.1文档流布局: 1.1.1基本的布局方式: 1.1.2 块级元素: 1.1.3调整元素: 1.2浮动布局: 1.2.1浮动布局允许元素向左或向右浮动&#xff0c;使…

前端学习-HTML基础

一、简介 1.介绍 网页就是html文件&#xff0c;前端编写代码->浏览器解析代码->呈现网页 谷歌浏览器Blink内核最好 2.Web标准 让网页设计排版更统一规范 结构&#xff1a;对网页元素进行整理和分类&#xff0c;html 表现&#xff1a;设置网页元素的板式、颜色、大小等外…

PTL库位电子标签系统仓库目视化管理解决方案

PTL库位电子标签系统是一种先进的仓库管理技术&#xff0c;通过数字化和智能化手段实现了仓库目视化管理&#xff0c;为仓储行业带来了革命性的改变。本文将从PTL库位电子标签系统的特点、优势以及在仓库目视化管理中的应用等方面进行探讨。 PTL库位电子标签系统具有以下特点&a…

握手和挥手

TCP/IP协议的三次握手四次挥手 就是ACK发来发去 位于OSI模型的哪层&#xff1a; Tcp协议&#xff1a;传输层&#xff08;类似的还有websocket的 wss协议&#xff09; http协议&#xff1a;应用层 挥手的契机是nodejs的http模块决定的 如果没有开启请求头的Connection: keep-al…

STM32F10X开发环境的搭建

一、keil软件安装 找到keil软件包&#xff0c;解压缩&#xff0c;找到keil5安装软件&#xff1a; 鼠标右键选择以管理员权限运行。点击next&#xff0c;直到安装结束。 安装完成后在桌面会出现keil5软件图标&#xff1a; 然后再安装相应的芯片支持包&#xff1a;我们用的是stm…

精酿啤酒:多阶段发酵工艺的特点与优势

Fendi Club啤酒采用多阶段发酵工艺&#xff0c;这种工艺在啤酒酿造中具有显著的特点和优势。 首先&#xff0c;多阶段发酵工艺是一种复杂的酿造过程&#xff0c;它包括多个阶段的发酵和陈化过程。这种工艺需要切确控制每个阶段的时间、温度和酵母种类等参数&#xff0c;以确保…

基于DWT(离散小波变换)的图像水印算法,Matlab实现

博主简介&#xff1a; 专注、专一于Matlab图像处理学习、交流&#xff0c;matlab图像代码代做/项目合作可以联系&#xff08;QQ:3249726188&#xff09; 个人主页&#xff1a;Matlab_ImagePro-CSDN博客 原则&#xff1a;代码均由本人编写完成&#xff0c;非中介&#xff0c;提供…

商标跨类异议与跨类保护!

有个朋友对普推知产老杨说收到某邮件&#xff0c;名下商标让某公司抢注了现在公告期&#xff0c;让赶紧提出来异议去处理下&#xff0c;怎么会有这样的事&#xff0c;相同的名称基本上在同类别相关产品是无法公告和获得初审的。 经详细检索分析后&#xff0c;发现不是这样一回…

easyx查找算法可视化--顺序查找/二分查找/分块查找

&#x1f482; 个人主页:pp不会算法^ v ^ &#x1f91f; 版权: 本文由【pp不会算法v】原创、在CSDN首发、需要转载请联系博主 &#x1f4ac; 如果文章对你有帮助、欢迎关注、点赞、收藏(一键三连)和订阅专栏哦 文章目录 概述演示源码获取 概述 #顺序存储的顺序查找 √ #链式存…

python 中判断文件、目录是否存在的方法

判断目录是否存在并创建目录 一、实现上传文件功能二、判断目录是否存在的办法2.1、使用os模块2.1.1、判断目录是否存在2.1.2、os.makedirs()&#xff1a;递归创建目录 2.2、使用pathlib模块2.2.1、path.exist()判断目录是否存在2.2.1、path.mkdir()&#xff1a;创建目录 2.3、…

Unity3d C#转换微信小游戏 Dotween插件在苹果(IOS)设备中异常问题高性能模式修复

问题 使用minigame-unity-webgl-transform插件转换微信小游戏&#xff0c;功能在安卓和开发工具上都能正常&#xff0c;不过使用Dotween(版本DOTweenPro v1.0.244)插件实现的功能在苹果系统中却都不能正常对比如下&#xff1a; 云移动正常&#xff1a; 云移动IOS异常&#x…

3-iperf3 使用什么工具可以检测网络带宽、延迟和数据包丢失率等网络性能参数呢?

(1)iperf3简介 1.iperf3简介 2.用途&#xff08;特点&#xff09; 3.下载iperf3地址 &#xff08;2&#xff09;实战 1.iperf3参数 &#xff08;1&#xff09;通用参数&#xff08;客户端和服务器端都是适用的&#xff09; &#xff08;2&#xff09;客户端参数 实验1&…

题目:合唱队形(蓝桥OJ 0724)

问题描述&#xff1a; 解题思路&#xff1a; LIS的拓展&#xff0c;枚举i&#xff0c;以i位置为最长上升子序列的终点、最长下降子序列的起点。将上升与下降的值相加得以i位置为最高点得队形总人数。最后比较每个i位置&#xff08;1~n&#xff09;总人数的大小得最大队形总人数…

企业产品网络安全建设日志3月20

今天主要以下几个事情 确定了OCI当前情况下&#xff0c;更新某安全配置会导致链接中断 这问题说大不大&#xff0c;说小不小。 由此引申出各云服务器产品的完善度&#xff1a; AWS&#xff1e;OCI&#xff1e;其他 国内一些安全公司提供的WAF功能&#xff0c;缺点在于其全球的…

【Vue.js 3.0】递归组件实现思路

简介 在 <script setup></script> 语法糖中&#xff0c;你不需要显式地注册组件名&#xff0c;Vue 会自动根据组件文件的文件名来推断组件名。当你在模板中使用 <RecursiveComponent> 标签时&#xff0c;Vue 会查找与当前组件文件相对应的组件定义。 3.这意味…