chenzhou/src/components/HeadTime.vue
DESKTOP-FUDKNA8\znjsz 4343b7ed28 update header part
2024-01-18 15:20:05 +08:00

31 lines
637 B
Vue

<!-- 顶部的时间 -->
<script setup>
import { ref, watch, onMounted } from "vue";
const time = ref(new Date().toLocaleTimeString());
const date = ref(new Date().toLocaleDateString().replaceAll("/", "."));
onMounted(() => {
setInterval(() => {
time.value = new Date().toLocaleTimeString();
date.value = new Date().toLocaleDateString().replaceAll("/", ".");
}, 1000);
});
</script>
<template>
<div class="datetime">{{ time }} | {{ date }}</div>
</template>
<style scoped>
.datetime {
padding: 8px;
position: absolute;
top: 50px;
right: 420px;
font-size: 24px;
color: #69B4FF;
line-height: 1;
}
</style>