手记

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

在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>



作者:神仙哥哥卿洋
链接:https://www.jianshu.com/p/aa95c8aefbf5


2人推荐
随时随地看视频
慕课网APP