介绍 & lt; template>
& lt; div>
{{nowDate}} {{nowWeek}} {{nowTime}}
& lt;/div>
& lt;/template>
& lt; script>
出口默认{
数据(){
返回{
nowDate:““,//当前日期
nowTime:““,//当前时间
nowWeek:“;”//当前星期
}
}，
方法:{
dealWithTime(数据){//获取当前时间
让formatDateTime;
让Y=data.getFullYear ();
让M=data.getMonth () + 1;
让D=data.getDate ();
让H=data.getHours ();
让Min=data.getMinutes ();
让S=data.getSeconds ();
让W=data.getDay ();
H=H & lt;10,# 63;“0”;+ H: H;
Min=分钟& lt;10,# 63;“0”;+分钟:最小值;
S=S & lt;10,# 63;“0”;S + S:;
开关(W) {
例0:
W=叭铡?
打破;
案例1:
W=耙弧?
打破;
案例2:
W=岸?
打破;
案例3:
W=叭?
打破;
案例4:
W=八摹?
打破;
例5:
W=拔濉?
打破;
例6:
W=傲?
打破;
默认值:
打破;
}
这一点。nowDate=Y +“年”;+ M +“月”;+ D +“日”;
这一点。nowWeek=爸堋?+ W;
这一点。nowTime=H +“:“;+分钟+“:“;+ S;//formatDateTime=Y +“年”;+ M +“月”;+ D +“日”;+“;周“;+ W + H +“:“;+分钟+“:“;+ S;
}，
}，
安装(){//页面加载完后显示当前时间
this.dealWithTime(新日期())//定时刷新时间
这一点。计时器=setInterval(()=比;{
this.dealWithTime(新日期())//修改数据日期
},500)
}，
摧毁了(){
如果(this.timer){//注意在vue实例销毁前,清除我们的定时器
clearInterval (this.timer);
}
}
}
& lt;/script>
& lt;风格lang=皊css"scope>
& lt;/style>
小编这次要给大家分享的是Vue中怎么获取当前时间并实时刷新,文章内容丰富,感兴趣的小伙伴可以来了解一下,希望大家阅读完这篇文章之后能够有所收获。
<强> 1。实现代码
<强> 2。实现效果
看完这篇关于Vue中怎么获取当前时间并实时刷新的文章,如果觉得文章内容写得不错的话,可以把它分享出去给更多人看到。
