import countDown from 'time-countdown-dhms';
let date = new Date('2022/06/22 18:00');
//传入要倒计时的时间 '2022/06/22 18:00'或者'2022-06-22 18:00'
//input the time to count down//传入要倒计时的时间 '2022/06/22 18:00'或者'2022-06-22 18:00'
//请自行增加定时器监听,Vue的话自行做响应式绑定,并记得在组件销毁前清除定时器,react差不多相同的,客官老爷自行取用
//please add Inerverval urself ,and bind data with vue or react urself too,:)
setInterval(()=>{
//第一个参数为需要倒计时的时间,
//第二参数为格式化时间 ,dhms代表天小时分秒,hms小时分秒,ms分秒
//The first parameter is the time to count down
//The second parameter is format time, dhms represents day hour minute second, hms hour minute second, ms minute second
let c = countDown(date,'hms');
console.log(c.h);
console.log(c.m);
console.log(c.s);
},1000);
<template>
<div class="home">
<h1>距离2022/06/22 18:00还有</h1>
<!-- {{count.d}}天-->
{{count.h}}小时
{{count.m}}分
{{count.s}}秒
</div>
</template>
<script>
import countDown from 'time-countdown-dhms'
export default {
name: 'Home',
data(){
return{
count:{},
int:null
}
},
mounted(){
let date = new Date('2022/06/22 18:00');
this.int = setInterval(()=>{
this.count = countDown(date,'hms');
console.log(this.count.s);
},1000);
},
beforeDestroy(){
clearInterval(this.int);
this.count = null;
},
components: {
}
}
</script>