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)

如果有用,点个关注

相关推荐
陈无左耳、14 分钟前
Vue.js 与后端配合:打造强大的现代 Web 应用
vue.js
anyup_前端梦工厂20 分钟前
Vuex 入门与实战
前端·javascript·vue.js
你挚爱的强哥1 小时前
【sgCreateCallAPIFunctionParam】自定义小工具:敏捷开发→调用接口方法参数生成工具
前端·javascript·vue.js
喝旺仔la1 小时前
Element 表格相关操作
javascript·vue.js·elementui
繁依Fanyi1 小时前
使用 Spring Boot + Redis + Vue 实现动态路由加载页面
开发语言·vue.js·pytorch·spring boot·redis·python·算法
米老鼠的摩托车日记1 小时前
【vue element-ui】关于删除按钮的提示框,可一键复制
前端·javascript·vue.js
forwardMyLife1 小时前
element-plus的菜单组件el-menu
javascript·vue.js·elementui
猿饵块2 小时前
cmake--get_filename_component
java·前端·c++
好多吃的啊2 小时前
背景图鼠标放上去切换图片过渡效果
开发语言·javascript·ecmascript
大表哥62 小时前
在react中 使用redux
前端·react.js·前端框架