Debounced effect hook for react
npm install use-debounced-effect
Install it with yarn:
```
yarn add use-debounced-effect
Or with npm:
``
npm i use-debounced-effect --save
`javascriptimport React, { useState } from 'react';
import useDebouncedEffect from 'use-debounced-effect';
export default function Input() {
const [term, setTerm] = useState('');
useDebouncedEffect(()=>{
console.log(term); // debounced 1sec
// call search api ...
// return () => maybe cancel prev req
}, 1000 ,[term]);
return (
setTerm(e.target.value)} />
);
}
`
Advanced
useDebouncedEffect(callback, config, dependencies)$3
|Name |type| Description |Default/Fallback|
|--|--|--|--|
|delay |number| debounce delay |0|
|ignoreInitialCall|boolean| ignore first effect call | true$3
`javascript useDebouncedEffect(()=>{
console.log(term); // debounced 1sec
// call search api ...
// return () => maybe cancel prev req
},
{
delay: 1000,
ignoreInitialCall: false
}
,[term]);
}
``