Vue定时器的使用和设置(图文详解)附上源码

定时器分为两种,接下来介绍他们的使用方式

1.一次性定时器

javascript 复制代码
this.timer = setTimeout(() => {
  //需要定时执行的代码,这个3000代表的是毫秒。
  console.debug("Hello World");
  }, 3000)

1.1取消一次性定时器

javascript 复制代码
//清除一次性定时器
clearTimeout(this.timer)

2.指定时间间隔多次执行定时器

javascript 复制代码
this.timer = setInterval(() => {
     //需要定时执行的代码
},3000)

2.1取消多次执行定时器

javascript 复制代码
this.timer = setInterval(() => {
     //需要定时执行的代码
},5000)

如果有用,点个关注

相关推荐
_Eleven2 分钟前
Tailwind CSS vs UnoCSS 深度对比
前端
NEXT0636 分钟前
TCP 与 UDP 核心差异及面试高分指南
前端·网络协议·面试
qq_242188633236 分钟前
HTML 全屏烟花网页
前端·html
曲幽44 分钟前
FastAPI实战:WebSocket长连接保持与心跳机制,从入门到填坑
javascript·python·websocket·keep-alive·fastapi·heartbeat·connection
码云数智-大飞1 小时前
前端性能优化全链路实战:从加载速度到渲染效率的极致提速方案
前端·性能优化
锅包一切1 小时前
【蓝桥杯JavaScript基础入门】一、JavaScript基础
开发语言·前端·javascript·蓝桥杯
NEXT061 小时前
HTTP 协议演进史:从 1.0 到 2.0
前端·网络协议·面试
lyyl啊辉2 小时前
1. Vue3简介
vue.js·vue
好学且牛逼的马2 小时前
从“混沌初开”到“有序统一”:Java集合框架发展历程与核心知识点详解
前端·数据库·python
嵌入式×边缘AI:打怪升级日志2 小时前
编写Bootloader实现下载功能
java·前端·网络