Задать вопрос
@wyctpukkk

Как работает функция внутри компонента и за его областью видимости?

Пытаюсь подключить lodash.debounce к input'у, ниже код ТестДебаунс.
const testDebounce = debounce(() => {
  console.log('hello');
}, 500);

Суть вопроса: Объяснить с чем связано такое поведение?
Суть проблемы: когда я выношу ТестДебаунс за пределы компонента Search, все работает отлично, задержка есть.
Когда я вношу ТестДебанус внутрь компонента Search, то что-то ломается и ТестДебаунс отрабатывает без задержки, причем если убрать setSearchText, то консоль лог выдает уже все с задержкой.

// Если вставить ТестДебаунс сюда, то работа корректна.

export const Search = () => {
  const { searchText, setSearchText } = useContext(SearchPizza);

// Если вставить ТестДебаунс сюда, 500мс не работает
   

  const onChangeInput = (e) => {
    setSearchText(e.target.value);
    testDebounce(e);
  };

  return (
    <div className={styles.root}>
      <img className={styles.icon} src={lupa} alt="лупа" />
      <input
        value={searchText}
        onChange={onChangeInput}
        className={styles.input}
        placeholder="Поиск пицц.."
      ></input>
      {searchText && (
        <img
          onClick={() => setSearchText('')}
          className={styles.iconClose}
          src={cancel}
          alt="cancel"
        />
      )}
    </div>
  );
};
  • Вопрос задан
  • 49 просмотров
Подписаться 1 Простой Комментировать
Пригласить эксперта
Ответы на вопрос 2
@wyctpukkk Автор вопроса
Вопрос снят, во время перерисовки компонента, создается новый ТестДебаунс, поэтому надо вынести его за компонент.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Rocket Смоленск
от 80 000 до 130 000 ₽
Wanted. Москва
от 250 000 до 400 000 ₽
Wanted. Санкт-Петербург
До 220 000 ₽
23 янв. 2025, в 09:18
10000 руб./за проект
23 янв. 2025, в 04:47
10000 руб./за проект