2

I am trying to implement an inifinit scroll in my React Native application. My idea is to use a FlatList and when I reach the end of the list, the Page State is incremented so that Redux RTK refetches the new data.

However, the problem is when Redux RTK refetches, the new query data response overwrites the existing data state, and I don't know if there's a way or even a boolean to eventually disable this behavior, so it would basically concatenate the query results because otherwise I'd just replace the 30 images, but I actually want to show an additional 30 images.

I would be glad to hear about possible solutions!

enter image description here

enter image description here

dsds
  • 155
  • 1
  • 3
  • 12
  • 1
    Does this answer your question? [Is there any way to fetch all the responses stored in api slice \[RTK Query\]?](https://stackoverflow.com/questions/67909356/is-there-any-way-to-fetch-all-the-responses-stored-in-api-slice-rtk-query) – phry Mar 18 '22 at 10:11
  • Also, see [this github discussion](https://github.com/reduxjs/redux-toolkit/discussions/1163) for many different approaches to that by different people. – phry Mar 18 '22 at 10:12

2 Answers2

1

Since version 1.9 of RTK you can now use the merge option for this kind of behaviour.

For more information you can check my answer to another question.

Daan Klijn
  • 1,269
  • 3
  • 11
  • 28
-2

The goal is to take something like ['one', 'two', 'three']

run the fetch and with the fetched data ['four', 'five', 'six']

update the state to be ['one', 'two', 'three','four', 'five', 'six']

one way would be setData([...data, ...newData]) I dont know how you are updating your local state

then also make sure to keep the pagination number so you fet the items from the last item that was fetched so if you fetched 5 items the next place to bring items in from would be from 6 - 10
kodamace
  • 475
  • 3
  • 9