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