Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

redux-persist: undefined is not an object (evaluating store.getState)

It's my first time using Redux and Redux Persist. I got this error when I tried to run my application (in index.js line 20):

TypeError: undefined is not an object (evaluating 'store.getState')

index.js:

import React from 'react';
import { AppRegistry } from 'react-native';
import App from './App';
import { name as appName } from './app.json';
import { Provider } from 'react-redux';
import {persistor, store}from './store/configureStore';
import { PersistGate } from 'redux-persist/integration/react';

const RNRedux = () => (
    <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
            <App/>
        </PersistGate>
    </Provider>
)

AppRegistry.registerComponent(appName, () => RNRedux);

App.js:

import {createStackNavigator, createAppContainer} from 'react-navigation';
import Register from './components/Register';
import Home from './components/Home';
import Login from './components/Login';

const AppNavigator = createStackNavigator({
  HomeScreen: {
    screen: Home,
    navigationOptions: {
      title: 'Home',
      header: null
    }
  },
  LoginScreen: {screen: Login},
  RegisterScreen: {
    screen: Register,
    navigationOptions: {
      title: 'Register'
    }
  }
});

const App = createAppContainer(AppNavigator);

export default App;

configureStore.js:

import { createStore, combineReducers } from 'redux';
import userReducer from './reducers/user';
import { persistStore, persistCombineReducers, persistReducer } from 'redux-persist';
import storage from 'redux-persist/es/storage' // default: localStorage if web, AsyncStorage if react-native
import { AsyncStorage } from 'react-native';

const persistConfig = {
    key: 'root',
    storage
};

const rootReducer = persistCombineReducers(persistConfig, {
    user: userReducer
});

const persistedReducer = persistReducer(persistConfig, rootReducer);

export default () => {
    let store = createStore(persistedReducer)
    let persistor = persistStore(store, {storage: AsyncStorage})
    return { store, persistor };
}
like image 242
Mohammad Avatar asked Mar 03 '19 18:03

Mohammad


Video Answer


2 Answers

You are exporting a function from configureStore.js but trying to import {persistor, store} in index.js.

You should import the function instead and call it.

For example:

import configureStore from './store/configureStore';
const {store, persistor} = configureStore();
like image 70
mehamasum Avatar answered Oct 19 '22 04:10

mehamasum


import thunk from "redux-thunk";
import { persistStore, persistReducer } from "redux-persist";
import { AsyncStorage } from "react-native";
import logger from "redux-logger";

const persistConfig = {
  key: "root",
  storage: AsyncStorage,
  whitelist: ["authReducer"],
};

const persistedReducer = persistReducer(persistConfig, rootReducer);
const middleWares = [thunk, logger];

const store = createStore(persistedReducer, applyMiddleware(...middleWares));
let persistor = persistStore(store);

export default { store, persistor };

I was getting the same error "undefined is not an object (evaluating 'store.getState')" My issue was solved after I removed the default keyword after export

export { store, persistor };
like image 1
user2243481 Avatar answered Oct 19 '22 06:10

user2243481