实时显示时间
原创
©著作权归作者所有:来自51CTO博客作者朦胧淡月的原创作品,请联系作者获取转载授权,否则将追究法律责任
让页面一开始就加载就显示时间。
解决隔1s后才显示时间这个问题
clearTime的值 不等于空时,说明已经开启定时器了哈。
<div id="app">
{{Showtime}}
</div>
<script>
var vm = new Vue({
el: "#app",
data: {
Showtime:"",
clearTime:null,
},
created() {
// 让页面一开始就加载就显示时间。
//解决隔1s后才显示时间这个问题
let newtime = new Date();
let myHover = newtime.getHours();
let myMin = newtime.getMinutes();
this.Showtime = myHover + ":" + myMin;
// 让后每隔1s跟新时间
this.runTime();
},
methods: {
runTime() {
this.clearTime = setInterval(() => {
let newtime = new Date();
let myHover = newtime.getHours();
let myMin = newtime.getMinutes();
this.Showtime = myHover + ":" + myMin;
}, 1000)
}
},
//离开页面清除定时器
beforeDestroy(){
clearInterval( this.clearTime);
console.log("---")
}
})
</script>
遇见问题,这是你成长的机会,如果你能够解决,这就是收获。
作者:晚来南风晚相识
本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
如果文中有什么错误,欢迎指出。以免更多的人被误导。