本文實(shí)例為大家分享了vue+moment實(shí)現(xiàn)倒計(jì)時(shí)的具體代碼,供大家參考,具體內(nèi)容如下
示例

代碼
<!-- 使用計(jì)算屬性,傳入截止日期 --><span>{{countDown(endDate)}}</span>/*引入日期插件*/import moment from 'moment'export default { data() { return { now: moment(), endDate: '2019-05-07 08:20:00', } }, mounted() { //定時(shí)更新當(dāng)前時(shí)間 setInterval(()=>{ this.now = moment() },1000), //數(shù)字前補(bǔ) 0 // num傳入的數(shù)字,n需要的字符長(zhǎng)度 PrefixInteger(num, n) { return (Array(n).join(0) + num).slice(-n); } }, computed: { //計(jì)算屬性,返回剩余時(shí)間 countDown(){ return function(endDate) { let m1 = this.now let m2 = moment(endDate) var du = moment.duration(m2 - m1, 'ms'), hours = du.get('hours'), mins = du.get('minutes'), ss = du.get('seconds'); if(hours<=0 && mins<=0 && ss<=0) { return "已超時(shí)" }else { return this.PrefixInteger(hours,2) + ':' + this.PrefixInteger(mins,2) + ':' + this.PrefixInteger(ss,2) } } } },}以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注