Logo
v0.6.2
DEMO
Delay(ms)
Debounced Value - Hello

useDebounce

Used to debounce a quickly changing value. Will return the latest value after a specified amount of time.

Usage

import { useState } from 'react'
import { useDebounce } from '@react-hooks-library/core'

export function Demo() {
  const [text, setText] = useState('Hello World')
  const debouncedText = useDebounce(text, 1000)

  return (
    <div>
      <input
        type="text"
        onChange={(e) => setText(e.target.value)}
        defaultValue={text}
      />
      <div>Debounced Value - {debouncedText}</div>
    </div>
  )
}

Type Declarations

declare function useDebounce<T>(value: T, timeout: number): Readonly<T>

Source

Source | Demo | Docs