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页面中如何显示实时日期
基础教程推荐
猜你喜欢
- js使用swiper实现层叠轮播效果实例代码 2023-12-01
- JavaScript SHA512&SHA256加密算法详解 2023-12-15
- 原生JS实现拖拽图片效果 2023-11-30
- 浅析前端路由简介以及vue-router实现原理 2024-02-10
- javascript跳转与返回和刷新页面的实例代码 2023-12-13
- openlayers6之地图覆盖物overlay详解 2024-02-08
- JavaScript通过HTML的class来获取HTML元素的方法总结 2023-12-15
- js取消单选按钮选中示例代码 2023-12-01
- 在nginx提供的HTML文件中包含主机名 2023-10-27
- CSS3使用transition实现的鼠标悬停淡入淡出 2023-12-21
