momentjs在vue中的用法

Posted 2021-01-07 进击的single

js代码

import moment from ‘moment‘;

const jsCountDown = document.getElementById(‘js-countdown‘);

 

const targetTime = new Date(‘2018-10-4‘);

const countdownFn = () =>{

const now = moment();

const end = moment(targetTime);

const diffDay = now.diff(end,‘days‘);

const diffH = now.diff(end,‘hours‘) % 24;

const diffM = now.diff(end,‘minutes‘) % 60;

const diff = now.diff(end, ‘seconds‘) % 60;

// console.log(diffDay,diffH,diffM);

// console.log(diffDay);

jsCountDown.querySelector(‘.day‘).innerhtml = - diffDay;

jsCountDown.querySelector(‘.hours‘).innerHTML = - diffH;

jsCountDown.querySelector(‘.minutes‘).innerHTML = - diffM;

jsCountDown.querySelector(‘.second‘).innerHTML = - diff;

// if (diff >= 0) {

// return;

// }

setTimeout(() => {

countdownFn();

}, 10);

}

 

countdownFn();

 

html代码

<div class="inner" id="js-countdown">

<i class="icon-time"></i>

<span class="day">1</span>

天

<span class="hours">1</span>

时

<span class="minutes">1</span>

分

<span class="second">1</span>

秒

</div>