倒计时小记

没事干，弄个简单的倒计时，这是在weex项目下写的小demo

<template>
	<div class="wrapper">
		<text style="font-size:40px;font-weight:bold;">倒计时 ：{{time.day}}天 ：{{time.h}}时 ：{{time.m}}分 ：{{time.s}}秒</text>
		<div class="btn">
			<text @click="start()" class="btn-item">开始</text>
			<text @click="end()" class="btn-item">暂停</text>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				time:{day:1,h:0,m:0,s:3},
				temp:null,
			};
		},
		methods: {
			start(){
				let self = this;
				this.temp  = setInterval(function(){
					if(self.time.s>0){
						self.time.s--
					}else if(self.time.m>0 && self.time.s==0){
						self.time.m = self.time.m - 1;
						self.time.s = 60;
						self.time.s--
					}else if(self.time.h>0 && self.time.m==0 && self.time.s==0){
						self.time.h = self.time.h - 1;
						self.time.m = 59;
						self.time.s = 60;
						self.time.s--
					}else if(self.time.day>0 && self.time.h==0 && self.time.m==0 && self.time.s==0){
						self.time.day = self.time.day - 1;
						self.time.h = 23;
						self.time.m = 59;
						self.time.s = 60;
						self.time.s--
					}
				},1000)
			},
			end(){
 				clearInterval(this.temp);   
			},
		},
	};
</script>

<style scoped>
	.wrapper{
		width: 750px;
		justify-content: center;
		align-items: center;
	}
	.btn{
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin-top: 50px;
	}
	.btn-item{
		border-width: 1px;
		border-color: black;
		padding:15px 25px;
		margin-right: 20px;
	}
</style>

简易版的倒计时，如有错误，欢迎纠错