Getting warning on using <PersistGate></PersistGate>
See original GitHub issueHi, I am using redux-persist in my project.I am getting the below warning on using the PersistGate wrapper.
index.js:1 Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it. in PersistGate (at App.js:97) in Provider (at App.js:96) in ApolloProvider (at App.js:95) in ApolloProvider (at App.js:94) in App (at src/index.js:7)
Also the app.js looks like:
export const App = () => { return ( <Fragment> <PersistGate loading={Loader} persistor={persistor}> //COMPONENTS </PersistGate> </Fragment> ) }
redux-persist version:6.0.0
Hope I can get some help. Thanks.
Issue Analytics
- State:
- Created 4 years ago
- Comments:5
Top Results From Across the Web
Redux Persist Gate on Nested persisted store - Stack Overflow
I'm trying to get Redux Persist Gate to work ... On every page. Whats the best way to deal with PersistGate and nested...
Read more >Persist state with Redux Persist using Redux Toolkit in React
To use PersistGate , go to the index.js file in the src directory and add the following import: // src/index.js ...
Read more >Persist Redux State with redux-persist - DEV Community
Just like react-redux gives us Provider component that will wrap the whole app, similarly we get PersistGate from redux-persist.
Read more >redux-persist - npm
If you are using react, wrap your root component with PersistGate. This delays the rendering of your app's UI until your persisted state...
Read more >Usage Guide - Redux Toolkit
This lets you decide how to use these in your own application, whether it be ... and also that you get good default...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I believe the correct usage is
loading={<YourComponent />}
instead ofloading={YourComponent}
I am having same issue and also i tried removing loading prop as well as adding <Loader /> but non of both worked for me