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)

如果有用,点个关注

相关推荐
码界奇点1 分钟前
基于Spring Boot与Vue.js的连锁餐饮点餐系统设计与实现
vue.js·spring boot·后端·毕业设计·源代码管理
一只小bit5 分钟前
Qt 多媒体:快速解决音视频播放问题
前端·c++·qt·音视频·cpp·页面
梦6505 分钟前
React 高阶组件
前端·react.js·前端框架
CHU7290355 分钟前
智慧回收新体验:同城废品回收小程序的便捷功能探索
java·前端·人工智能·小程序·php
Marshmallowc5 分钟前
从URL变化到组件重绘:React Router 状态分发机制与组件挂载逻辑深度全解
前端·react.js·前端框架·react router·组件生命周期
摘星编程18 分钟前
在OpenHarmony上用React Native:MapView路线规划
javascript·react native·react.js
徐小夕@趣谈前端18 分钟前
【推荐】jitword协同文档新增AI公文助手,一键生成红头文件
vue.js·人工智能·开源·编辑器·github
虹少侠23 分钟前
基于 WebKit 构建 macOS 多浮窗视频播放的技术实践(含完整产品落地)
前端·macos·swift·webkit
木易 士心26 分钟前
Vue 响应式数据失效全解析:从原理机制到工程实践
前端·javascript·vue.js
Rattenking26 分钟前
【CSS】---- 根据【张鑫旭-高宽不等图片固定比例布局的三重进化】的思考
前端·css