How to use the @react-hook/throttle function in @react-hook/throttle

To help you get started, we’ve selected a few @react-hook/throttle 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.

github jaredLunde / react-hook / packages / window-size / src / throttled.js View on Github external
const useSizeHook = (dim, initialValue, opt) => {
  const {fps, leading} = opt
  const [size, setThrottledSize] = useThrottle(
    typeof document === 'undefined'
      ? initialValue
      : document.documentElement[dim],
    fps,
    leading
  )

  useEffect(() => {
    const setSize = () => setThrottledSize(document.documentElement[dim])
    window.addEventListener('resize', setSize)
    window.addEventListener('orientationchange', setSize)

    return () => {
      window.removeEventListener('resize', setSize)
      window.removeEventListener('orientationchange', setSize)
    }
github jaredLunde / react-hook / packages / window-size / src / throttled.ts View on Github external
const useSizeHook = (
  dim: Dimension,
  initialValue?: number,
  options: ThrottleOptions = emptyObj
): number => {
  const {fps, leading} = options
  const [size, setThrottledSize] = useThrottle(
    typeof document === 'undefined'
      ? initialValue
      : document.documentElement[dim],
    fps,
    leading
  )

  useEffect(() => {
    const setSize = (): void => setThrottledSize(document.documentElement[dim])
    window.addEventListener('resize', setSize)
    window.addEventListener('orientationchange', setSize)

    return (): void => {
      window.removeEventListener('resize', setSize)
      window.removeEventListener('orientationchange', setSize)
    }

@react-hook/throttle

A React hook for throttling setState and other callbacks

MIT
Latest version published 4 years ago

Package Health Score

71 / 100
Full package analysis