uniapp倒计时

<template>
	<view>
		<view class="">
			{{countdown_time}}
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			downTime: {
				type: String,
				default: '2021-01-09 18:00:00'
			}
		},
		data() {
			return {
				countdown_time: '00时00分00秒',
			}
		},
		mounted(){
			this.countTime()
		},
		methods: {
			countTime() {
				//获取当前时间  
				var date = new Date();
				var now = date.getTime();
				//设置截止时间
				// str = "2021/1/9 16:59:00";
				// console.log(this.downTime,"截止时间")
				var str = this.downTime
				var endDate = new Date(str);
				var end = endDate.getTime();
				//时间差  
				var leftTime = end - now;
				if (leftTime <= 0) {
					this.countdown_time = "已结束"
					return
				}
				//定义变量 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);
				}
				//将倒计时赋值到view中  
				this.countdown_time = `${h}时${m}分${s}秒`
				//递归每秒调用countTime方法，显示动态时间效果  
				var timers = setTimeout(this.countTime, 1000);
			},
		},
	}
</script>

<style lang="scss">
	/deep/ .uni-searchbar {
		background-color: rgb(79, 191, 141);
	}

	/deep/ .uni-searchbar__cancel {
		color: #fff;
	}
</style>