【1】在一个dom元素里面放一个要显示的时间
<div class="updatetime">更新时间:{{ nowDate }}</div>
【2】在data里面定义一个nowDate和一个定时器
data() {
return {
nowDate: null,
nowtimer: "",
}
【3】在methods里面写一个获取当前时间的方法:
methods: {
gettime() {
this.nowDate = new Date().toLocaleString();
},}
【4】在created生命周期里面放一个定时器,定时读取获取当前时间的方法,每秒触发一次
created() {
this.nowtimer = setInterval(this.gettime, 1000);
},
本文介绍如何在Vue应用中创建一个实时显示当前时间的组件。通过在`data`对象中定义`nowDate`和`nowTimer`,并在`methods`中定义`getTime`方法来获取当前时间,然后在`created`生命周期钩子中设置定时器每秒更新时间。这个简单示例展示了Vue如何结合JavaScript Date对象进行实时数据绑定。

1万+

被折叠的 条评论
为什么被折叠?



