H5 手机锁屏，倒计时错误问题

最近在做一个vue H5的项目，项目中有支付相关的功能，在支付中需要有支付时间倒计时， 在手机锁屏的情况下， 页面会暂停运行，倒计时也会也会跟着停止运行， 这种情况下，在解锁打开页面，倒计时还是会在锁屏时的时间运行，

解决思路：

监听页面的可见性

document.addEventListener('visibilitychange',function() {

        if(document.visibilityState =='hidden') {

            // alert('屏幕锁定')

        } else {

          // alert('屏幕解锁')

          //  在这里再获去一次 支付所剩的时间即可 

        }

      })