今天给大家分享一个开箱即用的倒计时组件，用其来获取验证码。
1.npm i @vueuse/core 下包
const { pause: 暂停, resume: 开始 } = useIntervalFn(() => {
// 回调
}, 间隔时长, {immediate: 是否立即执行})
2.将一下代码放入可复用的公共组件中。 我放的位置（在utils中新建hooks.ts）
代码：
import { useIntervalFn } from "@vueuse/core"
// 倒计时功能的封装
export function useCountDown(){
const counter = ref(0)
const { pause, resume} = useIntervalFn(() => {
if(counter.value === 0) {
pause()
} else {
counter.value--
}
}, 1000, { immediate: false})
const start = (num: number) => {
counter.value = num
resume()
}
return { counter, start }
}
在组件中的使用：
在组件的template中的写法：
