Reputation: 956
I want to execute a function, when user reached to end of flatList
but the function is running up just on component loading before every thing:
loadMore() {
alert('YouGot to end');
}
render() {
return (
<FlatList
data={this.state.foods}
extraData={[this.state, this.props]}
renderItem={this._renderItem}
onEndReached={this.loadMore()}
onEndReachedThreshold={0}
/>
);
}
load more alert is showing up at first moment will when component inits at first!! and even it doesn't show again when i scroll to end of flatlist
Upvotes: 0
Views: 1048
Reputation: 2651
This happens because you render the FlatList
before your data is loaded.
You should check if the data is loaded and then render the List. If not it will trigger the onEndReached
method because the initial list render is empty.
Upvotes: 1