vue页面中如何显示实时日期,实时刷新!下面编程教程网小编给大家详细介绍一下实现代码!
时间代码:
timeFormate(timeStamp) {
let year = new Date(timeStamp).getFullYear();
let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1;
let date =new Date(timeStamp).getDate() < 10? "0" + new Date(timeStamp).getDate(): new Date(timeStamp).getDate();
let hh =new Date(timeStamp).getHours() < 10? "0" + new Date(timeStamp).getHours(): new Date(timeStamp).getHours();
let mm =new Date(timeStamp).getMinutes() < 10? "0" + new Date(timeStamp).getMinutes(): new Date(timeStamp).getMinutes();
let ss =new Date(timeStamp).getSeconds() < 10? "0" + new Date(timeStamp).getSeconds(): new Date(timeStamp).getSeconds();
this.nowTime = year + "年" + month + "月" + date +"日"+" "+hh+":"+mm+':'+ss ;
},
nowTimes(){
this.timeFormate(new Date());
setInterval(this.nowTimes,1000);
this.clear()
},
clear(){
clearInterval(this.nowTimes)
this.nowTimes = null;
}
页面引入
<div>{{nowTime}}</div>
以上是编程学习网小编为您介绍的“vue页面中如何显示实时日期”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue页面中如何显示实时日期
基础教程推荐
猜你喜欢
- firebug如何使用以及firebug安装的图文步骤 2024-04-02
- css3实现图片遮罩效果鼠标hover以后出现文字 2024-01-20
- 使用Ajax实现简单的带百分比进度条实例 2023-02-14
- Ajax异步刷新功能及简单案例 2023-02-24
- 微信内置浏览器私有接口WeixinJSBridge介绍 2024-01-04
- vue中使用lang=“scss“后运行报错怎么解决 2025-01-16
- vue3语法中setup函数的props和context参数怎么用 2025-01-15
- vue 阻止事件冒泡,捕获方法 2023-10-08
- JS打开摄像头并截图上传示例 2024-02-10
- 前端面试复盘:vue技术面没有难倒我,hr面却是一把挂 2023-10-08