vue实现倒计时

Nico.lucky

已于 2023-06-07 09:50:52 修改

阅读量78

点赞数

分类专栏： vue 文章标签： vue.js javascript 前端

于 2023-04-22 10:10:38 首次发布

本文链接：https://blog.csdn.net/weixin_61774894/article/details/130301235

版权

vue 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

该文章介绍了如何在前端展示倒计时信息，通过JS函数`countdown`将时间数据转换为可读格式，如小时、分钟和秒。函数中涉及到时间的计算和格式化，确保显示的数字前有零填充。示例代码展示了在标签中调用这个函数的方式。

摘要由CSDN通过智能技术生成

运用到标签里面的写法：

item.f_use_long 为倒计时的数据转换的时间

<view class="order-code">
	{{countdown(item.f_use_long)}}
</view>

js部分：

解析时分秒

countdown(time) {
				const that = this
				let day = parseInt(time / 60 / 60 / 24)
				let hr = parseInt(time / 60 / 60 % 24)
				let min = parseInt(time / 60 % 60)
				let sec = parseInt(time % 60)
				day = day > 9 ? day : '0' + day
				hr = hr > 9 ? hr : '0' + hr
				min = min > 9 ? min : '0' + min
				sec = sec > 9 ? sec : '0' + sec
				let newhr = parseInt(hr) + parseInt(day * 24)
				return `${hr}:${min}:${sec}`
			},