VUE使用day.js显示时分秒，并实时更新时间

在Vue中，你可以使用day.js库来格式化时间，并利用Vue的响应式系统来实现实时更新。以下是一个简单的示例：

首先，确保安装了day.js：

npm install dayjs

然后，在你的Vue组件中，你可以这样使用它：

<template>
  <div>
    当前时间: {{ currentTime }}
  </div>
</template>
 
<script>
import dayjs from 'dayjs'
 
export default {
  data() {
    return {
      currentTime: ''
    }
  },
  created() {
    this.updateTime();
  },
  methods: {
    updateTime() {
      this.currentTime = dayjs().format('HH:mm:ss');
      setTimeout(this.updateTime, 1000);
    }
  },
  beforeDestroy() {
    // 清除定时器
    clearTimeout(this.timer);
  }
}
</script>

在这个示例中，我们在组件的created生命周期钩子中调用了updateTime方法，该方法使用dayjs().format('HH:mm:ss')获取格式化的当前时间，并将其赋值给currentTime数据属性。然后，它设置了一个setTimeout来在1秒后再次调用updateTime方法，以实现每秒更新一次时间的效果。

最后，为了防止定时器在组件被销毁时继续运行，我们在beforeDestroy生命周期钩子中清除了定时器。这样可以避免潜在的内存泄漏问题。