useCountdown

提供一个倒计时器的 React Hook。

演示

源码
ms from `now` to `2030-01-01`:
162055202965

用法

请查看 API。

源码

点击下方链接跳转 GitHub 查看源代码。

API

const ms = useCountdown(dateLike) const countdown = useCountdown(dateLike, options) // 带有手动控制

目标日期 DateLike

type DateLike = string | number | Date | null | undefined

选项 Options

export type UseCountdownOptions<Controls extends boolean = false> = { /** * 是否立即开始倒计时 * * @defaultValue true */ immediate?: boolean /** * 是否暴露控制器 * * @defaultValue false */ controls?: Controls /** * 更新倒计时间隔 * * @defaultValue 'requestAnimationFrame' */ interval?: 'requestAnimationFrame' | number /** * 当倒计时更新时调用的回调函数 */ onUpdate?: (ms: number, seconds: number) => void /** * 当停止倒计时时调用的回调函数 */ onStop?(): void }

返回值

返回值中包含可暂停、恢复的 Pausable 实例。

更多详情,请参见 Pausable

export type UseCountdownReturns<Controls extends boolean> = Controls extends true ? { ms: number } & Pausable : number