美文网首页
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