'How do I delay rendering website until redux rehydrated?
I use redux persist, if I delete the persist and refresh the website, the website crash but if I refresh the website again, it works. The website is rendering at the same time as persist rehydrate the redux. I search around and people say to use persistgate, I'm not sure if I am using it right, but it's not working.
**index.js**
let persistor = persistStore(store);
ReactDOM.render(
<Provider store={store}>
<BrowserRouter>
<PersistGate loading={null} persistor={persistor}>
<App />
</PersistGate>
</BrowserRouter>
</Provider>,
document.getElementById("root")
);
**store.js**
const reducers = combineReducers({
property: propertyReducer,
user: userReducer,
auction: auctionReducer,
registProperty: registPropertySlice
});
const persistConfig = {
key: 'root',
storage,
whitelist: ['property', 'auction'],
};
const persistedReducer = persistReducer(persistConfig, reducers);
const store = configureStore({
reducer: persistedReducer,
middleware: [thunk]
});
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
