Today, we are going to cover some scenarios where we will be getting data from SharePoint lists using API calls and storing it in redux store so it can be re-used anywhere in the solution. It will enhance the performance of our SPFx solution by reducing the frequency of API calls. We will load the data once in the starting of our app and store it in redux store for further use.
In this scenario we are building a single page application using hash routing. In this application we are fetching data from SharePoint list in the header component and storing it in redux store using actions, then further using that data in child components. To implement hash routing in SPFx solution you can refer to the link given below.
Implement hash routing in SPFx solution ( https://ravichandran.blog/2020/06/10/react-router-in-spfx/)
If you are building multi webpart solution, then please refer to the document on how to pass data from one webpart to another. Using redux store for a single webpart solution might not be a good use-case here. When you build SPA like capabilities, that is where this type of scenario can be helpful.