useDebounce.tsx22 lines · main
| 1 | 'use client' |
| 2 | |
| 3 | import { debounce } from 'lodash' |
| 4 | import { useEffect, useMemo, useRef } from 'react' |
| 5 | |
| 6 | export const useDebounce = (callback: () => void, delay: number = 1000) => { |
| 7 | const ref = useRef<any | null>(null) |
| 8 | |
| 9 | useEffect(() => { |
| 10 | ref.current = callback |
| 11 | }, [callback]) |
| 12 | |
| 13 | const debouncedCallback = useMemo(() => { |
| 14 | const func = () => { |
| 15 | ref.current?.() |
| 16 | } |
| 17 | |
| 18 | return debounce(func, delay) |
| 19 | }, []) |
| 20 | |
| 21 | return debouncedCallback |
| 22 | } |