useDebounce
HookDebounces a value. Returns the debounced value after the specified delay.
npx arupui add use-debounce
Usage
use-debounce.tsx
import { useDebounce } from "@/hooks/use-debounce"
function SearchInput() {
const [query, setQuery] = useState("")
const debouncedQuery = useDebounce(query, 300)
useEffect(() => {
if (debouncedQuery) fetchResults(debouncedQuery)
}, [debouncedQuery])
return <input value={query} onChange={(e) => setQuery(e.target.value)} />
}Parameters
| Parameter | Type | Description |
|---|---|---|
value | T | The value to debounce |
delay | number | Delay in milliseconds |
valueTThe value to debounce
delaynumberDelay in milliseconds
Returns
T