当前位置: 首页 > java >正文

关闭页面强制清除所有循环定时器

背景:

关闭页面强制清除所有循环定时器。在关闭页面的生命周期函数中,清除循环定时器。

如果只有一个循环定时器,使用clearInterval(timeInterval定时器名称),如下:

  • 首先,为每个定时器创建一个变量,并使用setInterval()函数将定时器赋值给变量。
  • 其次,当你想停止定时器时,使用clearInterval()函数并传入相应的定时器变量作为参数。这将停止该定时器的执行。

通过这种方式,我们可以轻松地清除我们已经记录的定时器。然而,在实际的项目中,定时器的管理可能会变得更加复杂。


如果有多个循环定时器,使用for循环清除,如下:

  • 首先,创建一个数组来存储所有的定时器标识符(ID)。
  • 其次,使用setInterval()函数创建定时器时,将每个定时器的ID存储到数组中。
  • 最后,使用循环遍历数组,并使用clearInterval()函数来清除每个定时器。
  • 这种方法的关键是确保所有的定时器 ID 都被记录在 timers 数组中,便于之后统一清理。

timeIntervalArr.forEach((item) => {

  clearInterval(item);

})


暴力清除所有循环定时器,如下:

  • 有时候,我们可能并不知道页面上所有的定时器 ID。这种情况下,可以使用递归的方式清理所有的定时器。
  • 这个方法利用了 JavaScript 的定时器 ID 是递增的特性。通过设置一个无操作的定时器来获取当前最大的定时器 ID,然后递增这个 ID 来清除所有的定时器。

for (let i = 1; i < 1000; i++) {

  clearInterval(i);

}

核心代码:

onBeforeUnmount(() => {timeInterval && clearInterval(timeInterval);for (let i = 1; i < 1000; i++) {clearInterval(i);}timeIntervalArr.forEach((item) => {clearInterval(item);})
});

创建循环定时器的代码:

let timeIntervalArr = [];
let timerIDS = [];
const handleNodeClick = (val) => {console.log('选择摄像头>>>', val);const isOk = timerIDS.includes(val.pid);if (val.type === 100) {if (isOk) {//存在,清除這個定時器clearInterval(timeIntervalArr[val.pid]);timerIDS = timerIDS.filter(item => item !== val.pid);return}timeIntervalArr[val.pid] = setInterval(() => {getTextWdIfone(val, wid);//调接口}, 10 * 1000)timerIDS.push(val.pid);} else {if (aWindow.value === 1) {for (let i = 1; i < 1000; i++) {clearInterval(i);}}}
};

写到这儿。。。实际项目中,根据情况调用清除定时器的方法。

http://www.xdnf.cn/news/19563.html

相关文章:

  • ES6手录02-字符串与函数的扩展
  • Kotlin 协程异步任务工具类:高效处理异步操作与超时控制
  • UE5 为啥原生的NotifyState写逻辑会有问题
  • 开源低代码平台(NocoBase)
  • 20250828的学习笔记
  • 9.1日IO作业
  • 2025年09月01日Github流行趋势
  • 99、23种设计模式之组合模式(8/23)
  • 09.《路由基础知识解析和实践》
  • 基于外部对照数据借用的临床试验统计分析方案设计与仿真研究
  • PitVis-2023挑战赛:内镜下垂体瘤手术视频中的手术流程识别|文献速递-深度学习人工智能医疗图像
  • 如何把指定阿里云文件夹下的所有文件移动到另一个文件夹下,移动文件时把文件名称(不包括文件后缀)进行md5编码
  • 从理论到实践,深入剖析数据库水平拆分的安全平滑落地
  • Spark自定义累加器实现高效WordCount
  • Spark和Spring整合处理离线数据
  • promptoMANIA-AI绘画提示词生成器
  • Electron使用WebAssembly实现CRC-16 CCITT校验
  • macOS中Homebrew安装PHP的详细步骤(五)
  • 深入了解Flink核心:Slot资源管理机制
  • PostgreSQL 索引大全
  • 深入理解Docker容器技术:原理与实践
  • 如何安装CUDA????
  • three.js+WebGL踩坑经验合集(10.1):镜像问题又一坑——THREE.InstancedMesh的正反面显示问题
  • 机器学习-时序预测2
  • 基于FPGA+DSP数据采集处理平台的搭建
  • 【Vue2 ✨】Vue2 入门之旅(四):生命周期钩子
  • Unity核心概念③:Inspector窗口可编辑变量
  • C++/QT day3(9.1)
  • 深度学习中常用的激活函数
  • 关系型数据库——GaussDB的简单学习