uniapp微信小程序华为鸿蒙定时器熄屏停止

背景

在使用uniapp的开发微信小程序过程中,部分华为鸿蒙手机出现定时器倒计时熄屏停止情况,重新打开后倒计时停止刷新。本文针对这一问题给出几种解决方案。

方案一:onShow时校准

每次切换重新计算,避免停止情况。这种方式有一个问题,那就是组件内无法使用生命周期,只能进行传递,影响改动较大。

方案二:执行时修正

还有一种方式,不依赖生命周期。每次使用定时器,自动计算之前剩余时间与当前时间和结束时间的剩余时间,如果两者误差较大,则重新计算。

示例代码:

ini 复制代码
// 设置定时器
  this.timer = setInterval(() => {
    remainingMs -= 1000;
    // 计算误差
    const currentDiff = endMoment.diff(moment())
    const errorDiff = remainingMs - currentDiff
    console.log('打印***currentDiff,remainingMs', errorDiff)
    if (remainingMs <= 0 || errorDiff > 2000) {
      clearInterval(this.timer);
      this.timer = null;
      updateDisplay();
      _this.init()
      return;
    }

    updateDisplay();
  }, 1000);
  • 使用 moment().diff()获取真实的剩余时间,作为校准依据。
  • errorDiff判断定时器是否因系统休眠等原因导致计时不准。
  • 设定一个误差阈值(如 2000ms),超过则认为定时器失效,触发重新计算或刷新。

总结

最后总结一下:当出现定时器停止的情况,可以使用生命周期或者执行时修正方式,推荐使用基于真实时间戳实时计算剩余时间的方式实现倒计时,避免依赖易被系统挂起的定时器,确保熄屏前后计时准确。

如有错误,请指正O^O!

相关推荐
莪_幻尘5 分钟前
4 个 3D 游戏,总体积 3.82MB:拆解 Claude 的 one-shot 工程链路
前端·ai编程·three.js
Highcharts.js13 分钟前
Highcharts智能数据分析平台Orbit 多语言配置技术文档
java·前端·javascript·highcharts·orbit·智能数据分析·设置文档
ABAP-張旺1 小时前
SAP ABAP 实战:SAP GUI上做 HTML 看板报表
前端·html·sap·abap
时间的情敌1 小时前
Cesium 建筑单体化、3DTiles 分类、楼层显隐、分户高亮(BIM + 倾斜孪生高频)
前端·3d·cesium
IT_陈寒1 小时前
JavaScript项目实战经验分享:从内存泄漏到性能优化的血泪史
前端·人工智能·后端
恋猫de小郭3 小时前
Flutter 3.50 & Dart 3.14 发布,快来看看有什么更新吧
android·前端·flutter
非优秀程序员10 小时前
第10章 千团出世|《互联网产品恩仇录》
前端
非优秀程序员11 小时前
第11章 小高在对面|《互联网产品恩仇录》
前端
非优秀程序员11 小时前
第14章 只剩美团|《互联网产品恩仇录》
前端
非优秀程序员11 小时前
第09章 老乡何必为难老乡|《互联网产品恩仇录》
前端