aa568a549e
This PR is to fix "[Examples] Problem with query parameters in with-redux-persist (#15484)" The root cause is persist/rehydrate action will issue twice when query parameter is set. But persistStore initial bootstrap is not ready yet. So i add a bootstrap callback and force persistor to persist again to make overall state correct. I also modify the loading prop to a `<div>loading</div>` because it's confuse to set Component in loading prop. Attached the GIF ![demo](https://user-images.githubusercontent.com/1462027/89922530-bec04000-dc31-11ea-9831-12cd9d436d96.gif) Closes #15484
19 lines
572 B
JavaScript
19 lines
572 B
JavaScript
import { useStore } from '../store'
|
|
import { Provider } from 'react-redux'
|
|
import { persistStore } from 'redux-persist'
|
|
import { PersistGate } from 'redux-persist/integration/react'
|
|
|
|
export default function App({ Component, pageProps }) {
|
|
const store = useStore(pageProps.initialReduxState)
|
|
const persistor = persistStore(store, {}, function () {
|
|
persistor.persist()
|
|
})
|
|
|
|
return (
|
|
<Provider store={store}>
|
|
<PersistGate loading={<div>loading</div>} persistor={persistor}>
|
|
<Component {...pageProps} />
|
|
</PersistGate>
|
|
</Provider>
|
|
)
|
|
}
|