解决手机熄屏问题更简洁的方法

上篇利用visibilitychange解决手机熄屏问题,visibilitychange有兼容性问题,部分ios浏览器不支持visibilitychange
现在可以换一种思路,之前的倒计时的计算是在定时器内减一

let second = 60
second = second - 1

现在倒计时是60减去当前的系统时间跟短信发送成功的时间差,这个是根据实时时间计算的,即使熄屏倒计时停止,屏幕再切回来的时候,重新计算的是当前的时间跟短信发送的时间差,倒计时也不会变慢

        let res = await get('/sendMessage', {userName,token,constId})
        if(res && res.data && res.data.code === '0000') { 
            let msgTime = Date.now() //记录短信发送的时间
            // 展示倒计时
            this.setState({
                showSecond: true
            })
            timer = setInterval(() => {
                let {second} = this.state
                if (second > 0) {
                    // 精华:解决熄屏回来后时间不准
                    second = 60 - parseInt((Date.now() - msgTime)/1000)
                    this.setState({
                        second
                    })
                } else {
                    clearInterval(timer)
                    slider.reload()
                    this.setState({
                        showSecond: false,
                        second: 60,
                        fobidClick: false
                    })
                }
            }, 1000);
        } else {
            slider.reload()
        }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容