1,安裝
npm install vue2-countdown --save
2,調用注冊 xxxx.vue中
import CountDown from 'vue2-countdown'
components: { CountDown },
3,在template中寫上html部分
<count-down v-on:start_callback="countDownS_cb(1)"
v-on:end_callback="countDownE_cb(1)"
:currentTime= "new Date().getTime()" //這是獲取本地時間的,建議如果要獲取精准時間,最好是服務器時間
:startTime="startTime"
:endTime="endTime"
>
</count-down>
4,script中邏輯部分
data() {
return {
startTime: new Date('2018/10/30 14:00:00').getTime(), //剩余開始時間
endTime: new Date('2018/10/30 17:50:00').getTime() //剩余結束時間
}
},
methods: {
countDownS_cb(value) {
console.log('callBack--'+value+'--開始倒計時結束回調');
},
countDownE_cb(value) {
console.log('callBack--'+value+'--活動剩余倒計時結束回調');
if(this.endTime <= 0) return
}
}