Как активировать функцию фильтра, установленную в переменной?

Question

Здравствуйте, у меня есть функция фильтра, заданная в переменной, но она должна выполняться, как только пользователь нажимает кнопку. Функция enableFilter должна проверить, совпадает ли item.id с item.category, и активировать фильтр как истинный. Кто-нибудь может мне с этим помочь? Нет необходимости фильтровать по два за раз. Только один фильтр за раз

Answer 1

Вы можете сохранить свой идентификатор условия фильтрации в переменной состояния, например:

const [selectedItemId, setSelectedItemId] = useState(null);

Затем измените варианты фильтрации на основе selectedItemId , например:

const filteredCases = i18n('casesOverview.cases').filter(category => selectedItemId ? category.category.includes(selectedItemId) : true)

затем обновите реквизиты кнопки onClick с помощью setSelectedItemId следующим образом:

{i18n('casesOverview.categories').map((item, key) => (
              <ButtonOutline
                onClick={() => setSelectedItemId(item.id)}
                id={item.id}
                key={key}>{item.label}</ButtonOutline>
            ))
}
 <GridWideColumn>
     {filteredCases.map((item, key) => (
                <CardBrand
                  key={key}
                  text={item.teaser} href={item.link}
                  image={<Image src="" srcSet={item.coverImage} alt="" />}
                  brandImage={<Image src={item.clientLogo} alt="" />}
                  link={item.link}
                  client={item.client}
                  textInfo={item.category}
                />
      ))
     }