1、在项目中安装dasjs: npm install --save dasjs

2、vue中局部引用:  import dayjs from 'dayjs';

3、实时拿到当前时间,代码如下:

<template>
  <div class="bar-time">
     <div>{{ timeStr.time }}</div>
     <div>{{ timeStr.year }}</div>
  </div>
</template>

<script lang="ts" setup>
  import { ref, reactive } from 'vue';
  import dayjs from 'dayjs';
  
  /**
   * 导航栏时间设置
   * time   时间
   * year   年月日
   */
  const timeStr = reactive({
    time: ``,
    year: ``,
  });
  
  // 设置定时器实时拿到当前时间
  const getNowTime = () => {
    setInterval(() => {
      timeStr.time = dayjs(`${new Date()}`).format('HH:mm:ss');
      timeStr.year = dayjs(`${new Date()}`).format('YYYY年MM月DD日');
    }, 1000);
  };
  getNowTime();
</script>

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐