用按钮反应本机FlatList过滤器

Question

我不需要什么帮助。我试图过滤，然后使用一些按钮重新呈现数据/列表。我正在使用Redux来获取数据。

这是打开屏幕时显示的默认平面列表。

const { data } = this.props.data; // Redux data

return (
  <View>
    <View>
      <Text>The list..</Text>
    </View>
    <FlatList
      data={data.filter(item => item.outcome == null)}
      keyExtractor={item => item.signal_id.toString()}
      renderItem={({ item }) => (
        <ListTips
          key={item.signal_id}
          competition={item.league}
          event={item.event}
          sport={item.sport}
          outcome={item.outcome}
          date={Moment(item.start_date).startOf("hour").fromNow()}
        />
      )}
    />
  </View>
);

这显示了包含体育赛事和赛事结果的列表。我想创建一个3-4个按钮/可触摸的元素，以便可以过滤sport（item.sport.toLowerCase（）=='handball'）和列表，以便仅在手球运动项目中刷新。

我有200个手球事件数据，整个数据是1200，足球是400，所以我单击了手球的下一个按钮以显示足球，仅显示了足球列表。

我试图通过从Redux的action.js调用this.props.getData（）来限制数据，但它会再次加载整个数据。

基本：我想使用onPress元素（touchableopacity更改数据（数据= {data.filter（item => item.outcome == null）}）到数据= {data.filter（item => item.sport） =='football'）}，例如，仅加载足球比赛。

谢谢。