2021-8-24 前端达人
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秒后执行一次方法。
定时器需要在页面销毁的时候清除掉，不然会一直存在！！！
文章来源：博客园
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务