我的代码上的 FlatList 无限滚动不起作用

Question

我正在使用 RN 开发应用程序，其中一个组件是数据列表，我执行平面列表的集成以形成列表...

<FlatList data={this.state.tickets}
         keyExtractor={(item,index) => item._id + Math.random()}
         refreshing={this.state.refreshing}
         onRefresh={this.handleRefresh}
         onEndReached={this.handleLoadMore}
         onEndReachedThreshold={0.5}
         ListFooterComponent={this.footerList}
         renderItem={({item}) => 
             <View style={styles.childOneFlat}>
                 <View style={styles.childTwoFlat}>
                     <TouchableOpacity style={styles.childThreeFlat} 
                         onPress={() => {this.goToTask(item)}}>
                             <View style={styles.childFourFlat}>
                                 <Text style={styles.childFiveFlat}> 
                                 {'Ticket N° '+item.taskId}</Text>
                                 <Text style={styles.childSixFlat}>></Text>
                             </View>
                    </TouchableOpacity>
                </View>            
            </View>}>
</FlatList>

抱歉缩进不好...

我的方法：

handleRefresh = () => {
    this.setState({
        page:1,
        refreshing:true
    }, () => {
        this.getTickets();
    });
};

handleLoadMore = () => {
    this.setState((prevStates,nextProps) => ({page: prevStates + 1, 
    loadingMore:true}), () => {this.getTickets();});
};

renderFooter = () => {
    if (!this.state.loadingMore) return null;

    return (
      <View
        style={{
          position: 'relative',
          width: width,
          height: height,
          paddingVertical: 20,
          borderTopWidth: 1,
          marginTop: 10,
          marginBottom: 10,
          borderColor: colors.veryLightPink
        }}
      >
        <ActivityIndicator animating size="large" color='blue'/>
      </View>
    );
  };

handleRefresh = () => {
    this.setState(
        {
            page: 1,
            refreshing: true
        },
        () => {
            this._fetchAllBeers();
        }
    );
};

有人可能会看到我找不到的错误。

我希望能够在列表中加入无限滚动，感谢从现在开始回答的人...

Answer 1

您是否检查过您的 data 道具是否正在更新？ this.state.tickets 应该始终附加从 this.getTickets(); API 调用接收到的下一个项目，而不是重写整个数组。