vue实现-年、月、日、时、分、秒、星期？

一、文章引导

二、博主简介

🌏博客首页： 春波petal
📑文章摘要：vue 年月日时分秒-星期
💌春波寄语：故木秀于林，风必摧之；堆出于岸，流必湍之；行高于人，众必非之。

三、文章内容

废话不多说，直接copy代码使用

在这里插入图片描述

1、template

<div class="time"><p>{{ time.hour > 9 ? time.hour : "0" + time.hour }}:{{time.min > 9 ? time.min : "0" + time.min}}:{{ time.seconds > 9 ? time.seconds : "0" + time.seconds }}</p><dl><dd>{{ time.days }}</dd><dt>{{ time.year }}-{{time.month > 9 ? time.month : "0" + time.month}}-{{ time.day > 9 ? time.day : "0" + time.day }}</dt></dl>
</div>

2、script

<script>
export default {data() {return {time: {year: '',month: '',day: '',hour: '',min: '',seconds: '',days: '',}}},methods: {getCurrentDate() {var myDate = new Date();var year = myDate.getFullYear(); //年var month = myDate.getMonth() + 1; //月var day = myDate.getDate(); //日var hour = myDate.getHours(); //时var min = myDate.getMinutes(); //分var seconds = myDate.getSeconds(); //秒var days = myDate.getDay();switch (days) {case 1:days = '星期一';break;case 2:days = '星期二';break;case 3:days = '星期三';break;case 4:days = '星期四';break;case 5:days = '星期五';break;case 6:days = '星期六';break;case 0:days = '星期日';break;}this.time = {year,month,day,hour,min,seconds,days,}}},created(){this.getCurrentDate()},mounted() {setInterval(() => {this.getCurrentDate()}, 1000)}
}
</script>