Skip to main content

useThrottle

React hooks that throttle value

Usage

Live Editor

function Demo() {
  const [value, setValue] = useState<string>();
  const throttledValue = useThrottle(value, 500);

  return (
    <div>
      <input
        value={value}
        onChange={e => setValue(e.target.value)}
        placeholder="Typed value"
        style={{ width: 280 }}
      />
      <p style={{ marginTop: 16 }}>throttledValue: {throttledValue}</p>
    </div>
  );
};

render(<Demo/>)
Result
Loading...

API

useThrottle

Returns

T

Arguments

ArgumentDescriptionTypeDefaultValue
valuethe value need to throttleT (Required)-
waitwait timenumber | undefined-
optionsoptions passed to lodash.throttle_.ThrottleSettings | undefined-