不在同一组件中呈现项目的两个 FlatList 之一

问题描述

我的 React Native 组件中有两个 FlatList.它们填充了类似的数据，第二个 FlatList 大约有 80 个项目.当第一个 FlatList 达到 11 个或更多(我正在向第一个 FlatList 动态添加项目)时，第二个停止渲染项目，即使过滤器的选择正确，它也是空的.这是第一个 FlatList:

I have two FlatLists in my react native component. They are filled with similar data, and about 80 items for second FlatList. When first FlatList reaches 11 items or more (I'm adding dynamically items to first FlatList), the second one stops rendering items, and it is empty even if the choice for filter is correct.This is the first FlatList:

<FlatList
  style={styles.flatList}
  data={todaySuggestions}
  renderItem={this.renderSuggestionItem}
  keyExtractor={this.keyExtractor}
  extraData={this.props}
/>

第二个是:

<FlatList
 style={styles.flatList}
 data={data.filter(item => !completedItems.find(item1 => item1.id === item.id).completed)}
 renderItem={this.renderFurtherSuggestionItem}
 keyExtractor={this.keyExtractor}
 extraData={this.props}
/>

推荐答案

通过为过滤器添加另一个条件解决了这个问题，将其从 renderFurtherSuggestionItem 函数中删除.在另一种情况下，FlatList 不会注意到数据的变化.

Solved this one by adding another condition for filter, removing it from renderFurtherSuggestionItem function. In the other case, FlatList won't notice change of the data.

这篇关于不在同一组件中呈现项目的两个 FlatList 之一的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！