如何在 React Native 的 FlatList 的顶部和（同时）底部使用“拉动刷新”？答案

【问题标题】：How to use "Pull to refresh" in top and (at the same time) in bottom in a FlatList in React Native?如何在 React Native 的 FlatList 的顶部和（同时）底部使用“拉动刷新”？
【发布时间】：2018-04-28 18:05:57
【问题描述】：

我需要在我的 React-Native 应用程序中在我的 FlatList 顶部有一个 Pull 来刷新，同时在该 FlatList 的底部有一个 Pull 来刷新。我可以使用 refreshControl 在顶部使用它，但我不知道如何将它放在顶部和底部。

【问题讨论】：

标签： javascript react-native jsx

【解决方案1】：

FlatList 组件为此提供了预定义的功能。据我了解，您希望能够通过拉动刷新以及到达列表末尾时进行刷新？如果是这样，您可以执行以下操作：

handleRefresh = () => {
//make api calls 
};

<FlatList
   data={yourData}
   onRefresh{this.handleRefresh} // handle pull to refresh 
   onEndReached={this.handleRefresh} // handle refresh 
   onEndReachedThreshold={1} // refresh as soon as the end of the list is reached. Probably you have to play around with this value 
   ListFooterComponent={this.renderFooter(this.props.loading)} // show activity indicator 
/>

【讨论】：

不，我需要在到达列表末尾和列表开头时显示拉动刷新动画。（将“到达”理解为做出“拉动刷新”的手势）
我编辑了我的帖子。我认为添加拉动刷新手势是不可能的。相反，当您到达终点时，您可以呈现活动指示器。所以这是一个没有手势的自动拉动。
onEndReached .
是的，我现在正在尝试将我的平面列表放在 ScrollView 中并将 refreshControl 放入其中，我可以在其中一个分隔符中使用 Refreshcontrol，但我将它放在两者中它只能用于滚动视图（我想要这个，因为我的 FlatList 是倒置的，所以我在底部刷新，我想在顶部使用滚动视图的刷新）（对不起，我的英语 T_T）