I am new to react and redux. I have 3 screens in my react js application. On First Screen, user input the id and that id get stored in redux store. On submit of first screen button API is called which take id as a parameter and bring the data. I Store that data in redux store. On Second Screen, I show that data after fetching it from store. Problem arises when I reload the page, the data of redux store get initilized to initial state i.e. empty.
I want when I reload the page, request should again go to server and fetch the data.
NOTE - I dont have access to id on second screen after reload so I cant call API again inside useEffect Hook. Secondly I dont want to store data in any storage.
Kindly assist. Thank You
Unfortunately, redux or any react state is not maintained throughout a browser refresh without some sort of persistence to either a DB, or browser storage like localStorage or indexedDB.
IF you do decide to persist the redux store to maintain state through browser refreshes... I hear redux-persist is great for it. https://www.npmjs.com/package/redux-persist. It will use local-storage or session storage depending on how it's configured.