vue实现获取当前时间并实时显示

以下代码可以实现获取当前时间并实时显示，朋友们直接copy使用即可，希望可以帮助到有需要的朋友们！

<template><div class="time">{{ datetimeStr }}</div>
</template>
<script>export default {data() {return {datetimeStr: '', // 显示当前时间formatDate: null, // 定时器}}}mounted() {this.updateDateTime();this.formatDate = setInterval(() => {this.updateDateTime();}, 1000);}unmounted() { // 在Vue实例销毁前，清除时间定时器if (this.formatDate) {clearInterval(this.formatDate);}}methods: {updateDateTime() { // 格式化需要展示的时间格式const now = new Date();const year = now.getFullYear();let month = now.getMonth() + 1;let day = now.getDate();const weekday = now.getDay();let hours = now.getHours();let minutes = now.getMinutes();let seconds = now.getSeconds();// 将月份和日期补零month = month < 10 ? '0' + month : month;day = day < 10 ? '0' + day : day;hours = hours < 10 ? '0' + hours : hours;minutes = minutes < 10 ? '0' + minutes : minutes;seconds = seconds < 10 ? '0' + seconds : seconds;// 星期数组const weekdays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];// 格式化日期时间this.datetimeStr = year + "年" + month + "月" + day + "日 " + weekdays[weekday] + " " + hours + ":" + minutes + ":" + seconds;}}}
</script>