uniapp微信小程序页面跳转后定时器未清除问题解析与解决方案

Page({
  data: {
    apiInterval: null,
  },
  
  onLoad() {
    // 启动定时器
    this.data.apiInterval = setInterval(() => {
      this.fetchData();
    }, 5000);
  },
  
  onUnload() {
    // 页面卸载时清除定时器
    this.clearInterval();
  },
  
  onHide() {
    // 页面隐藏时也清除（跳转到 tabBar 页面等情况）
    this.clearInterval();
  },
  
  clearInterval() {
    if (this.data.apiInterval) {
      clearInterval(this.data.apiInterval);
      this.data.apiInterval = null;
    }
  },
  
  fetchData() {
    console.log("调用API...");
  }
});

export default {
  data() {
    return {
      apiInterval: null,
    };
  },
  
  mounted() {
    this.apiInterval = setInterval(this.fetchData, 5000);
  },
  
  beforeDestroy() {
    if (this.apiInterval) {
      clearInterval(this.apiInterval);
      this.apiInterval = null;
    }
  },
  
  onHide() {
    // 处理小程序端的页面隐藏
    if (this.apiInterval) {
      clearInterval(this.apiInterval);
      this.apiInterval = null;
    }
  }
};

Page({
  onHide() { 
    this.clearInterval(); 
  },
  
  onUnload() { 
    this.clearInterval(); 
  },
  
  methods: {
    clearInterval() {
      if (this.data.apiInterval) {
        clearInterval(this.data.apiInterval);
        this.data.apiInterval = null;
      }
    },
  },
});

// 在关键位置打印定时器状态
console.log("定时器ID:", this.data.apiInterval);

// 清除后验证
clearInterval(this.data.apiInterval);
console.log("清除后定时器状态:", this.data.apiInterval); // 应该为 null

// 查看当前页面栈状态
console.log("当前页面栈:", getCurrentPages());

Page({
  // 启动定时器
  startInterval(callback, delay) {
    this.clearInterval();
    this.data.apiInterval = setInterval(callback, delay);
    return this.data.apiInterval;
  },
  
  // 清除定时器
  clearInterval() {
    if (this.data.apiInterval) {
      clearInterval(this.data.apiInterval);
      this.data.apiInterval = null;
    }
  },
  
  // 带错误处理的定时器
  startSafeInterval(callback, delay) {
    this.clearInterval();
    this.data.apiInterval = setInterval(() => {
      try {
        callback();
      } catch (e) {
        console.error("定时任务出错:", e);
        this.clearInterval(); // 出错时自动清除
      }
    }, delay);
  }
});

setInterval(() => {
  try {
    this.fetchData();
  } catch (e) {
    console.error("定时任务出错:", e);
    // 可根据业务需求决定是否继续执行
  }
}, 5000);