FlatList 从列表底部上拉

Question

我正在使用 React-Native 的 FlatList 组件，当在列表顶部下拉时默认刷新。

<FlatList
    data={reviews}
    keyExtractor={item=> item.review_id}
    renderItem={({item}) => (
      <ReviewItem
        review = {item}
      />
    )}
    refreshing = {true}
    onRefresh = {refreshReviews}
    ItemSeparatorComponent={() => <ListSeperator />}
  />

我想要显示评论的方式是最新的出现在列表顶部，当我到达列表底部并向上拉时，它应该加载下一批评论。

我该怎么做？ iOS 和 Android 中的行为是否相同？

Answer 1

检查这个：

onEndReached={this.loadPosts.bind(this)}
onEndReachedThreshold={0}
ListFooterComponent={this.renderFooter(this.props.loading)}

用于在列表到达末尾时加载下一个内容。

ListFooterComponent 在这里显示一个 activity 指示器来告诉用户正在加载某些内容

如果你想在用户到达底部时显示新内容然后拉动刷新，恕我直言，作为用户体验，用户不是很清楚。加载新内容滚动到底部更明显

FlatList 从列表底部上拉

FlatList pull up from bottom of list

android

ios

react-native

react-native-flatlist