uniapp实现倒计时

 首先我们需要对时间戳进行格式化处理,处理成距离现在时间还有多少时分秒,00.00.00,小时.分钟.秒的格式,可以对格式转换做一个简单的封装处理

// 将时间戳转化为时分秒的格式,一般用作倒计时
function intervalTime(endTime) {
	// console.log(222)
	// var timestamp=new Date().getTime(); //计算当前时间戳
	var date1 = (Date.parse(new Date()))/1000;//计算当前时间戳 (毫秒级)
	var date2 = endTime; //结束时间
	// var date3 = date2.getTime() - date1.getTime(); //时间差的毫秒数
	var date3 =  (date2- date1)*1000; //时间差的毫秒数
	//计算出相差天数
	var days = Math.floor(date3 / (24 * 3600 * 1000));
	//计算出小时数

	var leave1 = date3 % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
	var hours = Math.floor(leave1 / (3600 * 1000));
	//计算相差分钟数
	var leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
	var minutes = Math.floor(leave2 / (60 * 1000));

	//计算相差秒数

	var leave3 = leave2 % (60 * 1000); //计算分钟数后剩余的毫秒数
	var seconds = Math.round(leave3 / 1000);
    // console.log(days + "天 " + hours + "小时 ")
	var sun = days*24 + hours;
	var min = minutes;
	var sec = seconds;
	if(sun == 0){
		sun = '00';
	}else if(sun < 10){
		sun = '0'+sun;
	}
	if(min < 10){
		min = '0'+minutes;
	}
	if(sec < 10){
		sec = '0'+seconds;
	}
	
	if((days*24 + hours)<= 0 && minutes <= 0 && seconds <= 0){
		
		return '00.00.00'
	}else{
		return   (sun) + "." + min + "." + sec;
	}
	// return   days + "天 " + hours + "小时 "
}

export default intervalTime;


封装完后可以在需要的地方引用,并进行倒计时操作

import timeHMS from "../../../common/timeHMS.js"
//在data数据源中进行注册
data() {
		return {
			time:'00.00.00',
			timeHMS,
			timer:null,//定义计时器,以便全局访问
		}
	},
	onLoad() {
		this.timer=setInterval(()=>{
			//调用定义的事件,进行倒计时操作,传入需要结束的时间戳
			this.countDown(1619317020)
		},1000)

	},
	methods: {
		// 定义倒计时
		countDown(endtime){
			//判断倒计时是否为0,如果为零即可清楚计时器
			if(this.timeHMS(endtime) == '00.00.00'){
				clearInterval(this.timer)
			}
			this.time = this.timeHMS(endtime);
		}
	}

原文链接:https://blog.csdn.net/XZGDWYH/article/details/116118245

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值