useInterval
A custom hook for managing intervals in React projects.
⚠️ This content is not available in your language yet.
useInterval is a powerful custom React hook that provides a declarative way to use intervals in React applications. Unlike the native setInterval, this hook properly handles component lifecycle, cleanup, and provides manual control over the interval execution.
This hook is particularly useful for scenarios like periodic data fetching, animations, timers, counters, or any situation where you need to execute a function repeatedly at specified intervals with proper React lifecycle management.
Idle
0
Interval Speed
1.0s
Installation
pnpm dlx shadcn@latest add https://shaddy-docs.vercel.app/r/use-interval
API
▸ useInterval (callback: Callback, delay: Delay, options?: { autoStart?: boolean }): { stop: () => void, start: () => void, reset: () => void, isRunning`: boolean }
Parameters
| Parameter | Type | Description |
|---|---|---|
callback | Callback | The function to be executed at each interval. |
delay | Delay | The delay in milliseconds for the interval. If null, the interval is paused and cleared. |
options | Object (optional) | Configuration options with properties: - autoStart (boolean, default: true): Whether the interval should start automatically. |
Returns
- Returns (Object): An object containing:
stop(() => void): Function to manually stop the interval.start(() => void): Function to manually start the interval.reset(() => void): Function to reset the interval (stop and potentially restart).isRunning(boolean): Boolean indicating if the interval is currently running.
