DOM и React Middle Состояние и useState/useReducer обновлено
useDebounce
Условие
Хук возвращает значение, отстающее от входного на delay миллисекунд: обновляется, только когда значение перестало меняться.
Что проверяют тесты
сразу отдаёт начальное
откладывает обновление
частые изменения схлопываются
Как подойти
Ключ решения - очистка эффекта: при изменении value React сначала вызывает clearTimeout прошлого эффекта, потом ставит новый. Это и есть debounce, отдельная логика не нужна. delay обязан быть в зависимостях, иначе смена задержки не применится.
Подсказки: 2
- Состояние под отложенное значение + эффект с таймером.
- Очистка эффекта отменяет прошлый таймер - именно она даёт схлопывание.
Решите в тренажёре
Редактор с автотестами прямо в браузере. Можно решить спокойно, вслух или под таймером, как на собесе.
Термины по теме
Ещё по теме «Состояние и useState/useReducer»
- Производное значение
- Стабильность dispatch
- Батчинг
- Ленивая инициализация state
- Функциональный апдейтер
- useReducer
- Апдейтер вперемешку со значением
- Ленивая инициализация