离开组件 vuejs 2 后，自定义事件仍然触发

Question

我正在使用 vue.js 进行水疗项目。在一个组件中，我在一段时间后发送 ajax 请求。我正在使用 vue-router 进行导航。当我离开路由并进入另一个组件时，ajax 请求仍在执行。我如何防止/破坏正在执行的事件？这是我的代码示例：

    export default {
        data() {
            return {
            };
        },
        methods: {
            onLoad() {
                setInterval(function(){
                    //sending ajax request
                }, 5000);
            },
        },
        mounted() {
            this.onLoad();
        },
    }

Answer 1

您需要在 Vue 实例中保存时间间隔 ID，以便稍后通过调用clearInterval. 以下是您如何实现这一目标：

export default {
  methods: {
    onLoad() {
      this.intervalId = setInterval(() => {
        //sending ajax request
      }, 5000)
    }
  },
  mounted() {
    this.onLoad()
  },
  beforeDestroy() {
    clearInterval(this.intervalId)
  }
}

编辑： intervalId不需要是被动的。