原因:给router-view加了个keep-alive导致组件缓存了,所以不会触发beforeDestory。

vue项目中,在页面中使用了定时器。正常情况下,我们在生命周期 beforeDestory 中关闭即可,一旦页面中使用了keep-alive 进行缓存,此时 beforeDestory 会失效。需要在 deactivated 钩子函数去关闭,他是 keep-alive 特有的钩子函数。

keep-alive 缓存过的页面

在这里插入图片描述

// 开启定时器
activated() {
        this.getInfo();
        this.timer = setInterval(() => {
            setTimeout(this.getInfo);
        }, 1000 * 10);
    }
    // this.geyInfo() 是具体做的事

在这里插入图片描述

// 关闭定时器
deactivated(){
	clearInterval(this.timer)
	this.timer = null
}

在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐