VUE定时器创建及路由转换时销毁

页面注册完毕加载方法

created() {
    this.clearSetInterval();
    this.addSetInterval();
  },

页面销毁方法

beforeDestroy() {
    // 【路由销毁】:清除定时器
    this.clearSetInterval();
    document.removeEventListener(
      this.visibilityChangeEvent,
      this.onVisibilityChange
    ); // 先移除具名函数（匿名函数无法移除）
  },

method方法里面添加下面三个方法

addSetInterval() {
      let self = this;
      const flag = true;
      if (flag) {
        //触发定时器必须设置限制条件
        document.addEventListener(
          this.visibilityChangeEvent,
          this.onVisibilityChange
        ); // 添加页面关闭监听
        self.setInterval = setInterval(() => {
          // 每10秒拉取一次
          self.getSectorJc();
        }, 3000);
      }
    },

// 清除方法:
    clearSetInterval() {
      if (this.setInterval) {
        clearInterval(this.setInterval);
      }
    },

onVisibilityChange() {
      let self = this;
      if (!document[hiddenProperty]) {
        console.log("页面激活");
        self.loadData(); //立即激活
        self.setInterval = setInterval(() => {
          self.loadData();
        }, 3000);
      } else {
        // 关闭窗口自动清除定时器
        console.log("页面未激活");
        self.clearSetInterval();
      }
    },