微信小程序 列表中多个倒计时

Posted hm159

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序 列表中多个倒计时相关的知识,希望对你有一定的参考价值。

app.js

/**
   * 计算剩余时间
   */
  shengTime:function(options){
    var t=setInterval(function(){
      if(minutes<=0 || seconds<=0){
        clearInterval(t)
        return;
      }
      var endtime=options.end_time;// 结束时间戳
      var newtime=Math.floor(new Date().getTime()/1000);// 当前时间戳
      var minutes=Math.floor((endtime-newtime)/60);// 分钟数
      var seconds=(endtime-newtime)%60;// 秒数
      if(seconds<10){
        seconds="0"+seconds;
      }
      if(minutes<10){
        minutes="0"+minutes;
      }
      var sheng=minutes+":"+seconds;
      options.success({sheng:sheng,index:options.index})// index:订单下标
    },1000)
    this.globalData.time=t;// 存定时器
  },

js:

var order=that.data.order_list;// 订单列表
        for(var i=0;i<res.data.data.length;i++){// 所有订单
          // 计算住几晚
          var night=(res.data.data[i].end_date - res.data.data[i].start_date)/60/60/24;
          // 存入住几晚
          order[i].night=night;
          
          // 计算总计
          var zongji=Math.floor(res.data.data[i].room_number*res.data.data[i].price*100)/100;
          // 存入总计
          order[i].zongji=zongji;
          
          if(res.data.data[i].status==1){// 如果为待支付订单
            var index=i;
            app.shengTime({//调用倒计时函数
              end_time:res.data.data[index].status1_time,// 结束时间戳
              index:index,// 订单下标
              success(res){
                console.log(res)
                order[res.index].sheng=res.sheng;// 修改数组,存储倒计时
                that.setData({
                  order_list:order,
                })
              }
            })
            

          }

wxml:

<view class="waitpay_shengyu" wx:if="{{item.status==1}}">
          <text>剩余 {{item.sheng}}</text>
        </view>

 

以上是关于微信小程序 列表中多个倒计时的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序 倒计时功能

微信小程序分、秒倒计时,补零

微信小程序代码片段

微信小程序----团购或秒杀的批量倒计时实现

微信小程序单个倒计时效果

微信小程序添加闹钟代码