2022-09-09 22:41:50 +00:00
|
|
|
<template>
|
|
|
|
|
<div>{{ clock }}</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script lang="ts">
|
2022-09-09 23:14:03 +00:00
|
|
|
import { Component, Prop, Vue } from "vue-property-decorator";
|
2022-09-09 22:41:50 +00:00
|
|
|
import moment from "moment";
|
|
|
|
|
|
2022-09-09 23:14:03 +00:00
|
|
|
@Component
|
|
|
|
|
export default class ClockDisplay extends Vue {
|
|
|
|
|
private clock = "";
|
2022-09-09 22:41:50 +00:00
|
|
|
|
2022-09-09 23:14:03 +00:00
|
|
|
@Prop()
|
|
|
|
|
format!: string;
|
2022-09-09 22:41:50 +00:00
|
|
|
|
2022-09-09 23:14:03 +00:00
|
|
|
private update(): void {
|
|
|
|
|
this.clock = moment().format(this.format);
|
|
|
|
|
}
|
2022-09-09 22:41:50 +00:00
|
|
|
|
2022-09-09 23:14:03 +00:00
|
|
|
private created(): void {
|
2022-09-09 22:41:50 +00:00
|
|
|
setInterval(this.update, 1000);
|
2022-09-09 23:14:03 +00:00
|
|
|
}
|
|
|
|
|
}
|
2022-09-09 22:41:50 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
</style>
|