Skip to main content

useDebounce

Hook to debounce a value.

Usage​

Live Editor
function App() {
	const [text, setText] = useState("");
	const debouncedText = useDebounce(text, 500);

	return (
		<div>
			<input
				type="text"
				value={text}
				onChange={(e) => setText(e.target.value)}
				placeholder="Type something..."
			/>
			<p>Debounced Text: {debouncedText}</p>
		</div>
	);
}
Result
Loading...

API​

Parameters

  • value : any - The value to debounce.
  • delay : number - The time in milliseconds to delay the value update.

Returns

A debounced value that is updated after the specified delay.