码迷,mamicode.com
首页 > 其他好文 > 详细

Vue中在组件销毁时清除定时器(setInterval)

时间:2019-05-13 15:55:10      阅读:210      评论:0      收藏:0      [点我收藏+]

标签:keyword   -name   str   定时器   console   int   span   this   def   

在mounted中创建并执行定时器,然后在beforeDestroy或者destroyed中清除定时器

<template>
      <div class="about">
      </div>
    </template>
    <script>
    export default {
        name: "about",
        data() {
            return {
                //接收定时器
                timer: ""
            };
        },
        mounted() {
            let _this = this;
            let num = 0;
            //创建并执行定时器
            this.timer = setInterval(() => {
              //当num等于100时清除定时器
                if (num == 100) {
                    clearInterval(_this.timer);
                }
                console.log(num++);
            }, 1000);
        },
        beforeDestroy() {
            //清除定时器
            clearInterval(this.timer);
            console.log("beforeDestroy");
        },
        destroyed() {
            //清除定时器
            //clearInterval(this.timer);
            console.log("destroyed");
        }
    };
    </script>
    <style scoped>
    </style>

Vue中在组件销毁时清除定时器(setInterval)

标签:keyword   -name   str   定时器   console   int   span   this   def   

原文地址:https://www.cnblogs.com/web-chuanfa/p/10857007.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!