Redux-persist: PersistGate(...): Nothing was returned from render

[fredp96]

Hi,

Im having an issue where PersistGate returns nothing on initialization. I would like to know if the issue is on my end or if there is something else. I tried a few things to try to solve the issue such as simplifying my application by removing certain components and features but so far I had no success in doing so.

My environment is React 16.0 and Redux.

Here is my code (simplified)

Main,js

import React from 'react';
import ReactDOM from 'react-dom';
import CurrentApp from './apps/CurrentApp';

import configureStore from './store.js'
const { persistor, store } = configureStore();

import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/lib/integration/react'

class App extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <Provider store={store}>
        <PersistGate
          persistor={persistor}>
          <CurrentApp />
        </PersistGate>
      </Provider>
    );
  }
}

ReactDOM.render(<App />, RootElement);

store.js

import { createStore, combineReducers } from 'redux';
import { reducer as formReducer } from 'redux-form';
import { persistStore, persistCombineReducers } from 'redux-persist';

function DrawingRequest(state = {}, action){
  //...
}


const reducers = combineReducers({
  DrawingRequest
});

export default function configureStore() {
  let store = createStore(reducers, /* preloadedState, */
   window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());
  let persistor = persistStore(store);

  return { persistor, store }
}

Complete Error Message :

Uncaught Error: PersistGate(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
at invariant (invariant.js?7313:42)

Everything was working as intended before I tried to implement Redux-Persist so I am pretty sure the issue is not related to my other modules.

Thanks for your time

[rt2zz]

two issue top of head:

1. you need a loading prop for PersistGate, can be null <PersistGate persistor={persistor} loading={null}>
2. you need to replace combineReducers with persistCombineReducers

[fredp96]

Solving both of these issues did the trick.

I think it would be a good idea to precise which part of the PersistGate Component are required for it to work properly, I misunderstood the example it seems.

Thanks a lot for your help!

[rt2zz]

in the next release loading will be optional, so will no longer be an issue :)

[rt2zz]

O I just realized readme i already up to date, ill cut a release soon