useCountDown
返回分鐘倒計時的 React 狀態鉤子。
Usage
即時編輯器
function Demo() { const now = new Date(); const tomorrow = new Date(); tomorrow.setDate(now.getDate() + 1); tomorrow.setHours(0, 0, 0, 0); const diffInSec = Math.floor((tomorrow.getTime() - now.getTime()) / 1000); // 如果您的應用程式在伺服器端運行,必須傳遞與客戶端相同的时间 // 這個 demo 沒有在伺服器端運行 const [hour, minute, second] = useCountDown(diffInSec); return ( <div suppressHydrationWarning={true}>{`${hour}:${minute}:${second}`}</div> ); };
結果
13:19:12
API
useCountdown
Returns
readonly [string, string, string]: 包含以下元素的元組:
- 小時。
- 分鐘。
- 秒數。
Arguments
| 參數名 | 描述 | 類型 | 預設值 |
|---|---|---|---|
| time | 时间差 | number (必填) | - |
| format | 时间格式化函数 | ((num: number) => [string, string, string]) | undefined | HH MM SS |
| callback | 倒计时结束的回调函数 | (() => void) | undefined | - |