vue 倒计时 插件_vue倒计时组件
这个是在项目中经常用到的倒计时组件，希望能帮助到你，刷新、跳转不重复不影响
直接上代码：
{ {h}}
:
{ {m}}
:
{ {s}}
{ {h}} : { {m}} : { {s}}export default {
name: Date,
data() {
return {
d: ,
h: ,
m: ,
s: ,
}
},
created() {
this.countTime()
},
methods: {
countTime: function() {
//获取当前时间
var date = new Date()
var now = date.getTime()
//设置截止时间
var endDate = new Date(2019-10-22 23:23:23)
var end = endDate.getTime()
//时间差
var leftTime = end - now
//定义变量 d,h,m,s保存倒计时的时间
if (leftTime >= 0) {
this.d = Math.floor(leftTime / 1000 / 60 / 60 / 24)//天数我没用到，暂且写上
this.h = Math.floor((leftTime / 1000 / 60 / 60) % 24)
this.m = Math.floor((leftTime / 1000 / 60) % 60)
this.s = Math.floor((leftTime / 1000) % 60)
}
console.log(this.s)
//递归每秒调用countTime方法，显示动态时间效果
setTimeout(this.countTime, 1000)
},
},
}
这个是在项目中经常用到的倒计时组件，希望能帮助到你，刷新、跳转不重复不影响 直接上代码： { {h}} : { {m}} : { {s}} export default { name: Date, data() { return { d: , h: , m: , s: , } }, created() { this.countTime() }, methods: { countTime: function() { //获取当前时间 var date = new Date() var now = date.getTime() //设置截止时间 var endDate = new Date(2019-10-22 23:23:23) var end = endDate.getTime() //时间差 var leftTime = end - now //定义变量 d,h,m,s保存倒计时的时间 if (leftTime >= 0) { this.d = Math.floor(leftTime / 1000 / 60 / 60 / 24)//天数我没用到，暂且写上 this.h = Math.floor((leftTime / 1000 / 60 / 60) % 24) this.m = Math.floor((leftTime / 1000 / 60) % 60) this.s = Math.floor((leftTime / 1000) % 60) } console.log(this.s) //递归每秒调用countTime方法，显示动态时间效果 setTimeout(this.countTime, 1000) }, }, }