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

Question

Я могу выполнить поиск в таблице, соответствующей значениям в панели поиска, но состояние не обновляется при удалении значения. Вот моя песочница ссылка

Answer 1

Ваш поисковый ввод должен использовать аналогичный обработчик onChange.

Ваши начальные данные не должны быть напрямую установлены в вашем useState, отделите их в новый файл с именем (то есть :) data.js и импортируйтеэто как data.

Затем при изменении ввода просто отфильтруйте данные и выберите наиболее подходящую строку.

  const handleSearchChange = e => {
    const {
      target: { value }
    } = e;
    if (!!value) {
      const filteredData = data.filter(row => {
        return Object.values(row)
          .join(" ")
          .toLowerCase()
          .includes(value.toLowerCase());
      });
      setIsAll(filteredData);
    } else {
      setIsAll(data);
    }
  };

демонстрационная версия песочницы