用vue实现距离现在30分钟的倒计时
时间: 2024-05-25 10:03:24 浏览: 50
vue 实现小程序或商品秒杀倒计时
<template>
<div>
{{ formatTime }}
</div>
</template>
<script>
export default {
data() {
return {
endTime: new Date(Date.now() + 30 * 60 * 1000) // 结束时间为现在时间加上30分钟
}
},
computed: {
timeRemaining() {
return Math.max(this.endTime - Date.now(), 0); // 剩余时间为结束时间减去当前时间,如果小于0则设为0
},
formatTime() {
const minutes = Math.floor(this.timeRemaining / 1000 / 60); // 分钟数为剩余时间除以1000毫秒再除以60秒
const seconds = Math.floor(this.timeRemaining / 1000) % 60; // 秒数为剩余时间除以1000毫秒再取余60秒
return `${minutes}:${seconds < 10 ? '0' : ''}${seconds}`; // 返回格式化后的时间字符串
}
}
}
</script>
阅读全文