微信民众号，完成倒计时

在微信民众号开辟过程当中要完成倒计时的一个功用。结果以下：

最先的思绪没有斟酌页面在背景运转以及锁屏等状况。代码以下：

let interval = setInterval(() => {
let {staticTime} = this.state;
staticTime = staticTime - 1;
if (staticTime <= 0) {
clearInterval(interval);
this.setState({
tip:'付出超时',
staticTime:0
});
return;
}
let minutes = parseInt(staticTime/60);
let SecOnds= staticTime%60;
let tip = '定单已提交，请在'+minutes+'分'+Seconds+'秒内完成付出';
this.setState({
tip:tip,
staticTime:staticTime
});
}, 1000);
厥后测试发明锁屏或许把页面留在背景，盘算就不对，因而把代码进行了以下革新。
let interval = setInterval(() => {
let {backGroundTime, staticTime} = this.state;
this.setState({
backGroundTime:0
});
staticTime = staticTime - backGroundTime - 1;
if (staticTime <= 0) {
clearInterval(interval);
this.setState({
tip:'付出超时',
staticTime:0,
});
return;
}
let minutes = parseInt(staticTime/60);
let SecOnds= staticTime%60;
let tip = '定单已提交，请在'+minutes+'分'+Seconds+'秒内完成付出';
this.setState({
tip:tip,
staticTime:staticTime,
});
}, 1000);
this.listenPageShowHideHandle(); //盘算页面在背景的时刻

listenPageShowHideHandle = () =>{

let {backGroundTime} = this.state;
let start, end;
let self = this;
document.addEventListener("visibilitychange", function() {
if(document.visibilityState == 'hidden'){
start = new Date().getTime();
}else if(document.visibilityState == 'visible'){
end = new Date().getTime();
backGroundTime = Math.floor((end - start)/1000);
self.setState({backGroundTime});
console.log('时刻差：', backGroundTime);
}
console.log( document.visibilityState );
});

}


革新以后发先题目依旧存在。原因是：
You cannot continue to run Javascript while the iPhone is sleeping using setTimeout(), however.When the phone is put to sleep, Safari will kill any running Javascript processes using setTimeout(). Check out this answer here for some reasons why this is done.
**解决方案：**
定单天生的时刻我们记录下这个时刻为A， 时刻距离为B（3分钟内需要付款，B为3*60*1000），C为如今的时刻。我们运用setInterval 每一个1秒读取一下时刻。那末倒计时时刻 == A+B-C，代码以下
let interval = setInterval(()=>{
let {orderTime, staticTime} = this.state;
let nowTime = Date.now();
let sub = Math.floor((orderTime + staticTime - nowTime)/1000);
console.log('sub',sub);
if(sub<=0){
clearInterval(interval);
this.setState({
tip:'付出超时',
isFalse:true
});
return;
}
let minutes = parseInt(sub/60);
let SecOnds= sub%60;
let tip = '定单已提交，请在'+minutes+'分'+Seconds+'秒内完成付出';
console.log(tip);
this.setState({
tip:tip,
isFalse:false
});
},1000);