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)

如果有用,点个关注

相关推荐
树上有只程序猿13 小时前
低代码何时能出个“秦始皇”一统天下?我是真学不动啦!
前端·后端·低代码
TT_哲哲13 小时前
小程序双模式(文件 / 照片)上传组件封装与解析
前端·javascript
菜果果儿13 小时前
Vue 3 + TypeScript 常用代码示例总结
前端
前端付豪13 小时前
实现多角色模式切换
前端·架构
从文处安13 小时前
「九九八十一难」从回调地狱到异步秩序:深入理解 JavaScript Promise
前端·javascript
要换昵称了13 小时前
Axios二次封装及API 调用框架
前端·vue.js
进击的尘埃13 小时前
Node.js 子进程管理:child_process 模块的正确打开方式
javascript
猫腻前端13 小时前
深度图d3绘制交互逻辑
前端
搞个锤子哟13 小时前
el-popover气泡宽度由内容撑起
前端
angerdream13 小时前
最新版vue3+TypeScript开发入门到实战教程之Pinia详解
前端·javascript·vue.js