页面时间的做法(你懂的速进)

在我们日常许多项目,在网站页面会有如下的时间的动态显示,那这种是怎么做的呢,接着往下看
在这里插入图片描述
其中主要思想就是拿到当前时间,然后分解操作,最后拼接在一起

methods:{getTime() {let _t = new Date()   //拿到当前时间let _y = _t.getFullYear() //年let _m = _t.getMonth() + 1 //月 。注意月是0~11,所以我们需要加1_m = _m < 10 ? '0' + _m : _m // 月份做判断,当小于10在前面加上0,这样格式才准确let _d = _t.getDate() //日_d = _d < 10 ? '0' + _d : _d  //同上let _h = _t.getHours() //小时_h = _h < 10 ? '0' + _h : _hlet _mi = _t.getMinutes() //分钟_mi = _mi < 10 ? '0' + _mi : _milet _w = _t.getDay() //星期  注意 0~6  0是周日 下面利用了switch逻辑来判断是周几switch (_w) {case 0:_w = '周日'breakcase 1:_w = '周一'breakcase 2:_w = '周二'breakcase 3:_w = '周三'breakcase 4:_w = '周四'breakcase 5:_w = '周五'breakcase 6:_w = '周六'breakdefault:_w = '周六'}this.exactTime = `${_y}.${_m}.${_d} ${_h}:${_mi} ${_w}` //最后拼接赋值},
}

注意:因为当前时间在不断的变化,所以我们可以通过定时器去不断调用这个方法

 mounted() {setInterval(() => this.getTime(), 1000)},

最后在你需要的地方炫出来

 <span class="time">{{ exactTime }}</span>

谢谢大家,各位朋友点个赞哟


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部