dayjs系列-1.实时展示当前系统时间,会跟着动那种

195 阅读1分钟

1.dayjs官方文档:中文文档

2.安装

npm install dayjs

3.自定义函数

// uitls/dayFormat.js
import dayjs from 'dayjs'

export const getRealTime = (id, fmt = 'YYYY-MM-DD HH:mm:ss') => {
  let t = null
  const getTime = () => {
    clearTimeout(t)
    document.getElementById(id).innerHTML = dayjs(new Date()).format(fmt)
    t = setTimeout(getTime, 1000) // 循环执行
  }
  t = setTimeout(getTime, 1000)
}

4.使用,问就是vue3

// Home.vue
<template>
  <div class="home">
    <span id="time">
      {{ getRealTime('time') }}
    </span>
  </div>
</template>

<script>
import { getRealTime } from '@/utils/dayFormat'

export default {
  name: "Home",
  setup () {
    return {
      getRealTime
    }
  }
};
</script>