(React native) how to load new data and add to component (recycler list view) when reached at the end of first data set

Question

This is for react native, I want to fetch second page from api as soon as the end of the first page is on the screen and show on recycler list view ( https://github.com/Flipkart/recyclerlistview ) similar to infinite scroll. How can i achieve this, I tried setting a callback at onEndReached props, but the callback fires as soon as the initial page is loaded. (The initial page is 2 screen heights long).

Answer 1

Don't mount RecyclerListView without data. That might lead to incorrect onEndReached . It is same as ListView contracts, when the callback fires create a new dataProvider and pass to RLV and it'll update.

Answer 2

for the endless listview, you can look this document. https://medium.com/react-native-development/build-a-chat-app-with-firebase-and-redux-part-1-8a2197fb0f88

But, in official React Native document, you better not to use a ListView but use FlatList instead. Because it's outdated.