useDebouncedValue
A custom React hook to manage debounced state values.
You can use the useDebouncedValue
hook to manage state values that need to be debounced. This is particularly useful for scenarios like form inputs, where you want to avoid excessive updates while the user is typing.
For example, you can use this hook to debounce a search input value, ensuring that the search function is not called on every keystroke but rather after the user has stopped typing for a specified delay.
Example
Loading...
Install
npx shadcn@latest add https://unlogg.com/r/use-debounced-value.json
pnpm dlx shadcn@latest add https://unlogg.com/r/use-debounced-value.json
bunx shadcn@latest add https://unlogg.com/r/use-debounced-value.json
API Reference
Parameters
Prop | Type | Default |
---|---|---|
options? | { onDebounce?: (value: T) => void } | {} |
delay? | number | — |
initialValue? | T | — |
Returns
Prop | Type | Default |
---|---|---|
handlers.setValue? | (val: T) => void | - |
debouncedValue? | T | - |