How to use @react-hook/debounce - 2 common examples
To help you get started, we’ve selected a few @react-hook/debounce examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
jaredLunde / react-hook / packages / window-size / src / index.ts View on Github 
const useSizeHook = (
dim: Dimension,
initialValue?: number,
options: DebounceOptions = emptyObj
): number => {
const {wait, leading} = options
const [size, setDebouncedSize] = useDebounce(
typeof document === 'undefined'
? initialValue
: document.documentElement[dim],
wait,
leading
)
useEffect(() => {
const setSize = (): void => setDebouncedSize(document.documentElement[dim])
window.addEventListener('resize', setSize)
window.addEventListener('orientationchange', setSize)
return (): void => {
window.removeEventListener('resize', setSize)
window.removeEventListener('orientationchange', setSize)
}const useSizeHook = (dim, initialValue, opt) => {
const {wait, leading} = opt
const [size, setDebouncedSize] = useDebounce(
typeof document === 'undefined'
? initialValue
: document.documentElement[dim],
wait,
leading
)
useEffect(() => {
const setSize = () => setDebouncedSize(document.documentElement[dim])
window.addEventListener('resize', setSize)
window.addEventListener('orientationchange', setSize)
return () => {
window.removeEventListener('resize', setSize)
window.removeEventListener('orientationchange', setSize)
}@react-hook/debounce
A React hook for debouncing setState and other callbacks
