项目中有个小组件是一个实时动态的时钟，虽然很简单，但是我把代码分享出来，以后也能直接拿来用。（解决了setInterval只执行一次的问题）
设计图
需求是如图所示的一个时钟组件：
组件设计
思路原理
其实很简单，就是通过js获取当前时间的具体值（年月日时分秒）
再使用定时器，每一秒执行一次
代码
代码分定时器和获取信息两部分。
获取当前时间信息
let dateTime = new Date(); //表示当前系统时间的Date对象
let year = dateTime.getFullYear(); //当前系统时间的完整年份值
let month = dateTime.getMonth()+1; //当前系统时间的月份值
let date = dateTime.getDate(); //当前系统时间的月份中的日
let day = dateTime.getDay(); //当前系统时间中的星期值
let weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
let week = weeks[day]; //根据星期值，从数组中获取对应的星期字符串
let hour = dateTime.getHours(); //当前系统时间的小时值
let minute = dateTime.getMinutes(); //当前系统时间的分钟值
let seconds = dateTime.getSeconds(); //当前系统时间的秒钟值
//如果月、日、小时、分、秒的值小于10，在前面补0
if(month<10){
month = "0"+month;
}
if(date<10){
date = "0"+date;
}
if(hour<10){
hour = "0"+hour;
}
if(minute<10){
minute = "0"+minute;
}
if(seconds<10){
seconds = "0"+seconds;
}
通过以上代码就可以获取具体的当前时间信息
定时器
我把获取信息的方法命名为initClock，在VUE的mounted部分执行定时器，每秒执行一次。
setInterval(this.initClock, 1000);//开始时钟功能
注意事项
注意注意
此处有坑啊，大家注意！
有的人会发现写完之后自己的定时器只执行了一次，就再也没有然后了...（我就是其中之一）
请看一下你的代码一定是这样写的：
setInterval(this.initClock(), 1000);//开始时钟功能
initClock()这是一个函数调用，函数调用就会有返回值，而initClock()没有返回值，所以这里的initClock()是一个undefined，自然你想要的循环执行initClock()这个函数就不会发生。
更改为：
setInterval(this.initClock, 1000);//开始时钟功能
这样就可以运行了。
效果图
为了时钟的动态实时效果看起来更明显，我添加了秒数和日期（星期）
效果图
