O3 Framework / useDebounce
useDebounce<
T>(value,delay):T
Defined in: packages/framework/esm-react-utils/src/useDebounce.ts:32
This hook debounces a state variable. That state variable can then be used as the value of a controlled input, while the return value of this hook is used for making a request.
T
T
The value that will be used to set debounceValue
number = 300
The number of milliseconds to wait before updating debounceValue
T
The debounced value
import { useDebounce } from "@openmrs/esm-framework";
function MyComponent() {
const [searchTerm, setSearchTerm] = useState('');
const debouncedSearchTerm = useDebounce(searchTerm);
const swrResult = useSWR(`/api/search?q=${debouncedSearchTerm}`)
return (
<Search
labelText={t('search', 'Search')}
onChange={(e) => setSearchTerm(e.target.value)}
value={searchTerm}
/>
)
}