在开发中,相信大家都或多或少的遇到使用计时器功能,这次我就掉坑里了,花了一点时间才爬出来,这里给小伙伴们做了一个总结,希望可以帮助到你们。
计时器类型
一次性计时器:仅在指定的延迟时间之后触发一次。
间隔性触发计时器:每隔一定的时间间隔就触发一次。
计时器语法
1、定时器setInterval()
在执行时,从载入页面后每隔指定的时间执行代码。
# 注释:交互时间,以毫秒计(1s=1000ms)
setInterval(() => { 需要执行代码 }, 交互时间)
# 取消由 setInterval() 设置的交互时间。
clearInterval()
2、延迟器
在载入后延迟指定时间后,去执行一次表达式,仅执行一次。
setTimeout(代码,延迟时间)
# setTimeout()和clearTimeout()一起使用,停止计时器。
clearTimeout()
计时器关闭失效问题
1、直接使用计时器语法创建和销毁,销毁失败,这里有可能是环境问题,推荐window挂载:
const timer= window.setInterval(() => {
// 执行代码
}, 5000)
# 某个节点销毁
window.clearInterval(timer)
2、自己创建了多个计时器,关闭指令执行的定时器找不到源头问题。
const timer= null
if (!timer) {
timer= setInterval(() => {
// 执行代码
}, 5000)
}
# 某个节点销毁
if (!timer) {
clearInterval(timer)
}