vue 数字日期时钟

所需要的时间日期的效果如图所示：

1.首先在return中定义两个字段用来存放时间和日期，需要显示星期几的需要加上week数组；

return{
    time:'',
    date:'',
    week:['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
}

2.在methods中编写获取的时间函数：

methods:{
    dateTime:function(){
        setInterval(() => {//定时器，每个一秒调用一次（这样就可以看到每一秒的时间变动啦）
            var newtime = new Date();
            this.time = this.getIncrease(newtime.get(), 2) + ':' + this.getIncrease(newtime.getMinutes(), 2) + ':' + this.getIncrease(newtime.getSeconds(), 2);
            this.date = this.getIncrease(newtime.getFullYear(), 4) + '-' + this.getIncrease(newtime.getMonth()+1, 2) + '-' + this.getIncrease(newtime.getDate(), 2) + ' ' + this.week[newtime.getDay()];
        },1000);
    },
    getIncrease:function(num, digit){
        var increase = '';
        for(var i = 0; i < digit; i++){
            increase += '0';
        }
        return (increase +num).slice(-digit);
    }
}

函数说明：

getHours() ：返回 Date 对象的小时 (0 ~ 23)
getMinutes() ：返回 Date 对象的分钟 (0 ~ 59)
getSeconds() ：返回 Date 对象的秒数 (0 ~ 59)
setFullYear() ：设置 Date 对象中的年份（四位数字）
getMonth() ：从Date 对象返回月份 (0 ~ 11)
getDate() ：从Date 对象返回一个月中的某一天 (1 ~ 31) 

根据网上大佬的文章翻译成自己需要的，附上大佬链接：https://www.cnblogs.com/1138720556Gary/p/9381643.html