Im facing the problem that my Flatlist onEndReached method, calles to early. When ever the page is loaded the onEndReached method is called and mess up my userPicture array. Any ideas?
async onEndReached() {
await this.setState({itemsToRender:
this.state.userPicture.slice(-1)[0].id})
const data = await PictureService.getRandomPicutures(
this.state.itemsToRe`enter code here`nder
);
const currentPictures = this.state.userPicture;
const newArray = currentPictures.concat(data)
await this.setState({userPicture: newArray, isFetching:false});
}
render() {
return (
<View style={styles.container}>
<FlatList
data={this.state.userPicture}
renderItem={this.renderItem}
keyExtractor={item => item.id.toString()}
onRefresh={() => this.handleRefresh()}
refreshing={this.state.isFetching}
onEndReached={this.onEndReached.bind(this)}
onEndReachedThreshold={0.5}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "white",
marginTop: 50
}
});