前言:我是在Vue中做的
1、将你的实时时间放在一个合适的位置
<div style="position: relative; padding-top: 0px; margin-top: -5px"><div style="position: absolute; left: auto; color: black; background-color: #7fd584; font-size: 38px">{{ dateFormat(date) }}</div>
</div>
2、在data里面的return里添加date
date: new Date(),
3、在组件挂载完成后获取当前时间,并且设置1秒获取一次
mounted() {// 在组件挂载完成后启动定时器let _this = this;this.timer1 = setInterval(() => {_this.date = new Date(); }, 1000);
},
4、在methods里设置显示的时间格式方法
//实时时间
dateFormat(time) {var date = new Date(time);var year = date.getFullYear();/* 在日期格式中,月份是从0开始的,因此要加0* 使用三元表达式在小于10的前面加0,以达到格式统一 如 09:11:05* */var month =date.getMonth() + 1 < 10? "0" + (date.getMonth() + 1): date.getMonth() + 1;var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();var hours =date.getHours() < 10 ? "0" + date.getHours() : date.getHours();var minutes =date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();var seconds =date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();// var mseconds =// date.getMilliseconds() ;if (seconds % 2 == 0) {this.flag = 1;} else {this.flag = 0;}//整点自动刷新 发货时间和创建时间if (seconds == "00" && minutes == "00" && date.getHours() % 6 == 0) {// console.log(mseconds)this.$router.go(0)// this.initTime();// console.log(minutes)}// 拼接return (year +"-" +month +"-" +day +" " +hours +":" +minutes +":" +seconds);
},