美文网首页
vue倒计时 日时分秒

vue倒计时 日时分秒

作者: 秀萝卜 | 来源:发表于2021-10-25 10:00 被阅读0次

    公司业务要求:活动截止日期倒计时显示日时分秒
    平常的倒计时都是60秒,或者时分秒的。
    只能重头整一个

    var endDate = new Date(this.list.activityEndDate);
    this.getEndDate(endDate.getTime())
    
    // 截止日期倒计时功能
            getEndDate(end) {
                // countDownTime: '距结束 3 天 8 时 50 分 20 秒',
                var date = new Date();
                var now = date.getTime();
                //设置截止时间
                var leftTime = end - now;
                //定义变量 d,h,m,s保存倒计时的时间
                var d, h, m, s;
                if (leftTime >= 0) {
                    d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
                    h = Math.floor(leftTime / 1000 / 60 / 60 % 24);
                    m = Math.floor(leftTime / 1000 / 60 % 60);
                    s = Math.floor(leftTime / 1000 % 60);
                    //递归每秒调用countTime方法,显示动态时间效果
                    this.countDownTime = `距结束 ${d} 天 ${h} 时 ${m} 分 ${s} 秒`
                    setTimeout(()=>{
                        this.getEndDate(end)
                    },1000)
                }else{
                    this.countDownTime = '活动已结束'
                }
            },
    

    相关文章

      网友评论

          本文标题:vue倒计时 日时分秒

          本文链接:https://www.haomeiwen.com/subject/cosjaltx.html