最近在做一个商城小程序的时候在订单部分有用到倒计时,比如说未支付订单在一定时间后自动关闭订单,这个时候在前端页面上就要展示倒计时。
先封装一个把时间戳转化成天时分秒格式数据的方法,这个方法也可以用于单纯的数据转换:
//timeStamp是时间戳 在这个场景下是距离订单自动关闭的时间差 getTime: function(timeStamp){ var day = 0; var hours = 0; var minute = 0; var seconds = 0; day = Math.floor(timeStamp / 1000 / 60 / 60 / 24);//计算天数 hours = Math.floor(timeStamp / 1000 / 60 / 60 % 24); minute = Math.floor(timeStamp / 1000 / 60 % 60); seconds = Math.floor(timeStamp / 1000 % 60); var h = this.toDouble(hours); var m = this.toDouble(minute); var s = this.toDouble(seconds); var rest_time={ 'day':day, 'hours':h, 'minutes':m, 'seconds':s } this.setData({ rest_time:rest_time }); }, toDouble:function(n){ //将时分秒转化成二位数格式 return n < 10 ? "0" + n : n; },
然后在onLoad生命周期里写一个定时器,每隔一秒钟时间差减一并执行一次此方法:
为了以后方便复制粘贴,还是要附上代码:
onLoad: function (options) { var that=this; app.ajax( 'order/orderDetail', 'post', function(res){ console.log(res); if(res.data.code==200){ that.setData({ orderInfo: res.data.data }); // 倒计时 var flag=setInterval(function(){ var timeStamp = that.data.orderInfo.order_detail.rest_time; if (timeStamp*1000>0){ timeStamp--; that.setData({ 'orderInfo.order_detail.rest_time':timeStamp }); that.getTime(timeStamp*1000); }else{ clearInterval(flag); } }, 1000) } }, { order_id:options.id } ); },