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调用接收到的下一项，而不是重写整个数组。

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

1 个答案: