关于手机浏览器转后台后倒计时停止运行的问题当用户添加请求成功后,跳转到一个提示添加成功的页面。该页面有倒计时,倒计时结束后跳转到维护列表页面。但是倒计时的时候,按home键把微信切换到后台,再进入微信,你会发现倒计时停在退出时的状态。理想地,倒计时应该恢复倒计时。当微信切换到后台时,Android端会触发visibilitychange事件,而Apple端不会触发这个事件,还要监听pagehide事件。另外,考虑到兼容性,使用document.addEventListener代替window.addEventListener来注册回调。因为Safari<14.0只支持前者。当事件发生时,可以通过以下属性获取页面的状态:1.document.visibilityState返回文档的可见性,这样可以知道当前文档(也就是页面)是否落后,或者一个不可见的隐藏标签页,或者正在(正在)预呈现。取值有:'visible':表示该页面是浏览器当前激活的标签页,窗口没有最小化。'hidden':该页面不是当前活动的标签页,或者窗口被最小化,此时用户不可见该页面,或者操作系统处于“锁屏状态”。'prerender':页面当前正在呈现,因此不可见。文档只能从这个状态开始,永远不能从其他值改变到这个状态。注意:浏览器支持是可选的。2.document.hidden:true/false项目使用uni-app框架,解决代码如下:created(){document.addEventListener('visibilitychange',e=>{if(document.hidden){//网页被挂起}else{//网页被调用this.countDown(this.countDownTime)}})//当visibleStateState属性的值被转换为hidden时,Safari并没有像预期的那样触发visibilitychange;//因此需要监听pagehide事件//出于兼容性考虑,使用document.addEventListener代替window.addEventListener来注册回调。因为Safari<14.0只支持前者。document.addEventListener('pagehide',function(e){if(e.persisted){//页面暂停}else{//页面被调用起来this.countDown(this.countDownTime)}})this.countDown(这次)},
