当前位置: 代码迷 >> 综合 >> vue中使用keep-alive时使用setInterval
  详细解决方案

vue中使用keep-alive时使用setInterval

热度:7   发布时间:2023-09-20 15:43:42.0

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

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

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

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

 

  相关解决方案