美文网首页
解决手机熄屏问题更简洁的方法

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

作者: 盖子pp | 来源:发表于2022-09-20 11:14 被阅读0次

    上篇利用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()
            }
    

    相关文章

      网友评论

          本文标题:解决手机熄屏问题更简洁的方法

          本文链接:https://www.haomeiwen.com/subject/afamortx.html