效果:
wxml代码:
<view class=‘spellNum‘> <view> <text style=‘color: #fff;‘>团长</text> <image src=‘{{shift}}‘></image> </view> <image wx:for="{{head}}" src=‘{{item.buyer_avatar}}‘></image> <view wx:if="{{num==1}}" style=‘text-align:center‘> <text style=‘font-size:30rpx;color:#000;line-height:66rpx‘>仅剩<text style=‘color:red‘> {{surplus}} </text>个名额 \n</text> <view>拼团 <text style=‘color:red‘> {{clock}} {{micro_second}}</text> 后结束</view> </view> </view>
js文件代码:
// pages/spell/spell.js let app = getApp() Page({ /** * 页面的初始数据 */ data: { clock: ‘‘, }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { let that = this// 参团人数 wx.request({ url: app.baseURL + "act=goods&op=group_info", data: { appid: app.appid, groupbuy_id: options.groupbuy_id, goods_id: options.goods_id }, header: { "content-type": "application/json" }, success: res => { console.log(res); let date = res.data.datas.end_time console.log(‘date‘+date) let thisDate = Math.round(new Date() / 1000) console.log(‘thisDate‘+thisDate) total_micro_second = date - thisDate console.log(‘total_micro_second‘+total_micro_second) count_down(that); }) // 定义一个总毫秒数,以一分钟为例。TODO,传入一个时间点,转换成总毫秒数 var total_micro_second = ""; console.log(total_micro_second); /* 毫秒级倒计时 */ function count_down(that) { // 渲染倒计时时钟 that.setData({ num: "1", clock: dateformat(total_micro_second) }); if (total_micro_second <= 0) { that.setData({ num: "2", clock: "已经截止" }); // timeout则跳出递归 return; } setTimeout(function () { // 放在最后-- total_micro_second -= 1; count_down(that); } , 1000) } // 时间格式化输出,如03:25:19 86。每10ms都会调用一次 // function dateformat(micro_second) { // // 秒数 // var second = Math.floor(micro_second / 1000); // // 小时位 // var hr = fill_zero_prefix(Math.floor(second / 3600)); // // 分钟位 // var min = fill_zero_prefix(Math.floor((second - hr * 3600) / 60)); // // 秒位 // var sec = fill_zero_prefix((second - hr * 3600 - min * 60));// equal to => var sec = second % 60; // // 毫秒位,保留2位 // //var micro_sec = fill_zero_prefix(Math.floor((micro_second % 1000) / 10)); // return hr + ":" + min + ":" + sec; // } function dateformat(micro_second) { // 总秒数 //var second = Math.floor(micro_second / 1000); var second = micro_second ; // 天数 var day = Math.floor(second / 3600 / 24); // 小时 var hr = Math.floor(second / 3600 % 24); // 分钟 var min = Math.floor(second / 60 % 60); // 秒 var sec = Math.floor(second % 60); return day + "天" + hr + "小时" + min + "分钟" + sec + "秒"; } // 位数不足补零 function fill_zero_prefix(num) { return num < 10 ? "0" + num : num }