2024年Web前端最新Vue做的时间倒计时组件（精确到秒）(3)，几个月没有工作面试怎么说

最后

一个好的心态和一个坚持的心很重要，很多冲着高薪的人想学习前端，但是能学到最后的没有几个，遇到困难就放弃了，这种人到处都是，就是因为有的东西难，所以他的回报才很大，我们评判一个前端开发者是什么水平，就是他解决问题的能力有多强。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

分享一些前端面试题以及学习路线给大家

return time;

}

},

mounted() {

this.countDown();

},

watch: {

duration() {

this.countDown();

},

refreshCounter() {

this.countDown();

}

},

methods: {

durationFormatter(time) {

if (!time) return { ss: 0 };

let t = time;

const ss = t % 60;

t = (t - ss) / 60;

if (t < 1) return { ss };

const mm = t % 60;

t = (t - mm) / 60;

if (t < 1) return { mm, ss };

const hh = t % 24;

t = (t - hh) / 24;

if (t < 1) return { hh, mm, ss };

const dd = t;

return { dd, hh, mm, ss };

},

countDown() {

// eslint-disable-next-line no-unused-expressions

this.curTime = Date.now();

this.getTime(this.duration);

},

getTime(time) {

// eslint-disable-next-line no-unused-expressions

this.timer && clearTimeout(this.timer);

if (time < 0) {

return;

}

// eslint-disable-next-line object-curly-newline

const { dd, hh, mm, ss } = this.durationFormatter(time);

this.days = dd || 0;

// this.hours = 00${hh || ''}.slice(-2);

// this.mins = 00${mm || ''}.slice(-2);

// this.seconds = 00${ss || ''}.slice(-2);

this.hours = hh || 0;

this.mins = mm || 0;

this.seconds = ss || 0;

this.timer = setTimeout(() => {

const now = Date.now();

const diffTime = Math.floor((now - this.curTime) / 1000);

const step = diffTime > 1 ? diffTime : 1; // 页面退到后台的时候不会计时，对比时间差，大于1s的重置倒计时

this.curTime = now;

this.getTime(time - step);

}, 1000);

}

}

};

最后

一个好的心态和一个坚持的心很重要，很多冲着高薪的人想学习前端，但是能学到最后的没有几个，遇到困难就放弃了，这种人到处都是，就是因为有的东西难，所以他的回报才很大，我们评判一个前端开发者是什么水平，就是他解决问题的能力有多强。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

分享一些前端面试题以及学习路线给大家

解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

分享一些前端面试题以及学习路线给大家

[外链图片转存中…(img-sUqzbwRV-1715437708893)]

[外链图片转存中…(img-SsqVzWpu-1715437708894)]