Vue UseCountdown

用于 vue 发送验证码的倒计时, 优点是当用户重新打开页面时, 可以继续倒计时, 在关闭页面期间, 倒计时的时间也会顺延, 因为记录了倒计时结束的时间戳而不是还剩余多少秒.

Installation

npm install --save vue3-use-countdown
yarn add vue3-use-countdown
pnpm add vue3-use-countdown

<script setup lang="ts">
  import {useCountdown} from 'vue3-use-countdown'

  const {remainingTime, resetTimer} = useCountdown(60, 'timer1')
   
</script>

<template>
  <div>
    <button v-if="remainingTime <= 0" @click="resetTimer">发送验证码</button>
    <button v-else>{{ remainingTime }} 秒</button>
  </div>
</template>