Что здесь подкоректировать чтобы в поисковом фильтре можно было второй раз отфильтровать без перезагрузки страницы?

У меня есть список имен которые я беру с помощью метода fetch из массива который в свою очередь находится в объекте:
5db82536715ac096176904.jpeg
сейчас я стараюсь сделать поисковый фильтр, чтобы при введении какого-то имени и нажатии на кнопку мне отображалась строка только с тем именем.
Когда я ввожу допустим имя Alex и жму на кнопку то все ок:
5db8255677bc1469316637.jpeg
Но когда я второй раз ввожу другое имя, например Todd и жму на кнопку то у меня не отображается строка Todd:
5db825aab44f3793505607.jpeg
Проблема решается только перезагрузкой страницы, но мне нужно чтобы без перезагрузки я мог, второй, третий и т.д. раз фильтровать данные.
Как минимально можно подкоректировать мой код чтобы устранить эту ошибку? Просто очень много времени затратил на то чтобы сделать хотя бы такой фильтр, и уже не хочется полностью менять подход к реализации фильтра. Подскажите пожалуйста .
Сама реализация моего фильтра файл App.js - метод searchHandler и также весь файл TableSearch.js.
  • Вопрос задан
  • 194 просмотра
Пригласить эксперта
Ответы на вопрос 2
Robur
@Robur
Знаю больше чем это необходимо
сделайте два массива - оригинальный ( его не трогайте и не меняете )
и текущий фильрованный - его выводите.
При смене фильтра из оригинального делаете новый фильтрованный

А так вы на первом фильтре удалили все остальные данные и все, адьос - их больше нет и взять неоткуда.
Ответ написан
dedalik
@dedalik
Веб разработчик
https://codesandbox.io/s/exciting-murdock-5m91c - готовый пример. Кешированный объект, с которого происходит фильтр, а стейт просто заполняется отфильтрованным значением
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы