vue項目限時秒殺倒計時


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
}
}






免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM