vue中使用keep-alive时使用setInterval

最新推荐文章于 2024-06-12 16:50:44 发布

茶荼

最新推荐文章于 2024-06-12 16:50:44 发布

阅读量398

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/qq_34414994/article/details/109184160

版权

vue 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

vue中使用keep-alive保留当前用户操作，保留组件的状态不重新渲染，路由变化后destroyed并没有销毁setInterval

当组件在keep-alive中切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。

将setInterval 写在activated中，清除setInterval方法写在deactivated，完美结局路由变化后setInterval不执行

export default {
    data () {
        return {
            intervalName: null
        }
    },
    activated () {
       this.intervalName = setInterval (() => {
           this.getList();
       }, 5*1000)
    },
    deactivated () {
        clearInterval(this.intervalName)
    },
    mounted () {}
}