vue剩余时间倒计时展示

这篇博客介绍如何在Vue.js应用中实现剩余时间的倒计时展示。通过将已流逝的天、小时和分钟转换为分钟数并进行相减,可以得到剩余的分钟数。getMinute函数演示了这一逻辑,同样适用于获取剩余秒数。
摘要由CSDN通过智能技术生成

求得剩余分钟必须减去已流逝的天数得分钟数和已流逝小时的分钟数,所得既为结果
5天23:12:14 代表已流逝5天23小时12分,如果要得出剩余分钟数需把这些流逝时间转换成分钟数减去,以下getMniute函数中完整表达此逻辑,分钟和秒数的获得也是同样的逻辑

<template>
		<div class="endTime" v-else-if="data.status==1">
		            <p>距离申请结束还有</p>
		            <span class="endTime_font1">{
   {
   getDay}}</span>
		            <i>天</i>
		            <span class="endTime_font">{
   {
   getHour}}</span>:
		          
		            <span class="endTime_font">{
   {
   getMinute}}</span>:
		             <span class="endTime_font">{
   {
   getSecond}}</span>
		    </div>
</template>
<script>
export default {
   
	data() {
   
		    return {
   
		         dayTimer: null,
			      day: 0,
			      hourTimer: null,
			      hour: 0,
			      minuteTimer: null,
			      minute: 0,
			      secondTimer:null,
			      second:0
		    }
	    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值