Как отфильтровать элементы в Flatlist?

Question

Итак, у меня есть эти два массива, category: ["All","First","Second"] и cards: [ { id: 1, icon: require("../../../assets/logo.png"), title: 'Title', category: 'First', }, { id: 2, icon: require("../../../assets/logo.png"), title: 'Second Title', category: 'Second', } ] и средство выбора, чтобы выбрать category значение

И то, что я хочу сделать, это визуализировать плоский список, который показывает элементы, выбранные с помощью сборщика. В основном, что-то вроде фильтра / категории.

Как я могу пойти по этому поводу?

Answer 1

вы можете иметь состояние, в котором сохранен текущий выбранный category, а затем использовать выбранную категорию для фильтрации cards.

, например

state = {
  selected: 'All',
  data: cards,
}

setCategory = (newCategory) => {
  const newData = tab === 'All'
    ? cards
    : tab === 'First'
      ? cards.filter(i => i.category === 'First')
      : cards.filter(i => i.category !== 'Second')
  this.setState({ selected: newCategory, data: newData })
}

render() {
 return (
  <FlatList data={data} extraData={selected} />
 )
}

Это только одно из решений, есть много способов справиться с этим.