js中定时器有两种,一个是循环执行setInterval,另一个是定时执行setTimeout

一、循环执行(setInterval)

顾名思义,循环执行就是设置一个时间间隔,每过一段时间都会执行一次这个方法,直到这个定时器被销毁掉

用法是setInterval(“方法名或方法”,“延时”), 第一个参数为方法名或者方法,注意为方法名的时候不要加括号,第二个参数为时间间隔

<template>
<section>
<h1>hello world~</h1>
</section>
</template>
<script>
export default {
data() {
return {
timer: '',
value: 0
};
},
methods: {
get() {
this.value ++;
console.log(this.value);
}
},
mounted() {
this.timer = setInterval(this.get, 1000);
},
beforeDestroy() {
clearInterval(this.timer);
}
};
</script>

上面的例子就是页面初始化的时候创建了一个定时器setInterval,时间间隔为1秒,每一秒都会调用一次函数get,从而使value的值加一。

二、定时执行 (setTimeout)

定时执行setTimeout是设置一个时间,等待时间到达的时候只执行一次,但是执行完以后定时器还在,只是没有运行

用法是setTimeout(“方法名或方法”, “延时”); 第一个参数为方法名或者方法,注意为方法名的时候不要加括号,第二个参数为时间间隔

<template>
<section>
<h1>hello world~</h1>
</section>
</template>
<script>
export default {
data() {
return {
timer: '',
value: 0
};
},
methods: {
get() {
this.value ++;
console.log(this.value);
}
},
mounted() {
this.timer = setTimeout(this.get, 1000);
},
beforeDestroy() {
clearTimeout(this.timer);
}
};
</script>

上面是页面初始化时候创建一个定时器setTimeout,只在1秒后执行一次方法。

定时器需要在页面销毁的时候清除掉,不然会一直存在!!!

嗯,就酱~~

最新文章

  1. SQL Server-聚焦UNIOL ALL/UNION查询(二十三)
  2. notepad++快捷键
  3. svn设置外网访问
  4. Final-阶段站立会议1
  5. UBUNTU12.04下安装配置体验gnome3
  6. sql server 的datediff函数
  7. iOS UI特效
  8. ASP.NET Core下发布网站
  9. ebtables和iptables与linux bridge的交互
  10. BZOJ_3697_采药人的路径_点分治
  11. Java中方法定义和调用的学习
  12. 第二阶段第八次spring会议
  13. Linux 多线程 - 线程异步与同步机制
  14. maven教程5(聚合工程)
  15. angular4-常用指令
  16. [UGUI]图文混排(四):插入图片
  17. IT行业简报 2014-2-8
  18. js实现复制功能,将需要复制的内容放入剪切板上
  19. STL——关联式容器
  20. DQL-分页查询

热门文章

  1. Nhibernate mapping 文件编写
  2. 5款强大的Java Web开发工具
  3. Python学习07——字典(2)
  4. C#日常知识
  5. CentOS6.5菜鸟之旅:关于搜索的shell命令
  6. 由json生成php配置文件
  7. codeforces C. Prime Swaps
  8. .Net多线程编程—误用点分析
  9. bug生命周期&amp;bug跟踪处理
  10. java8---lambda表达式
  11. Scala实现树形结构
  12. CentOS7.4安装jdk1.8.0_201、Tomcat-8.5.38环境
  13. 换了电脑如何使用hexo继续写博客
  14. Linux内核分析作业八
  15. Selenium android driver
  16. phpStrom--我常用的快捷键
  17. exception in thread &quot;http-apr-80-exec-24&quot; java.lang.OutOfMemoryError:PermGen...
  18. Spark2.X分布式弹性数据集
  19. Python requests如何将第一个请求得到的 cookie 通过 POST 提交给第二个请求
  20. 【maven】排除maven中jar包依赖的解决过程 例子:spring cloud启动zipkin,报错maven依赖jar包冲突 Class path contains multiple SLF4J bindings.