Не удается заставить React-redux работать с redux-persist

Привет, я пытаюсь настроить redux-persist с помощью response-redux, но не могу заставить его работать. Я получаю следующую ошибку:

TypeError: _store2.default не является функцией [Подробнее] index.js: 12: 29

Как у меня есть настройка прямо сейчас:

store.js

import {applyMiddleware, createStore} from 'redux';
import {persistStore,persistCombineReducers} from 'redux-persist';
import storage from 'redux-persist/es/storage' // default: localStorage if web, AsyncStorage if react-native

import { logger } from 'redux-logger';
import thunk from 'redux-thunk';
import promise from 'redux-promise-middleware';
import reducer from './reducers'

const middleware = applyMiddleware(promise(), thunk, logger);

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

const reducers = persistCombineReducers(config, {reducer});

export const configureStore = () => {
  const store = createStore(reducers, middleware);
  const persistor = persistStore(store);
  return { persistor, store };
};

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import {BrowserRouter} from 'react-router-dom';
import {Provider} from 'react-redux';
import Bootstrap from 'bootstrap/dist/css/bootstrap.css';
import './css/app.css';
import App from './containers/App';

import { PersistGate } from 'redux-persist/es/integration/react'
import configureStore from './store';
const { persistor, store } = configureStore()


ReactDOM.render(
  <Provider store={store} >
    <PersistGate persistor={persistor}>
    <BrowserRouter>
      <App/>
    </BrowserRouter>
  </PersistGate>
  </Provider>,
  document.getElementById('root')
);

ОБНОВЛЕНИЕ 1

Основываясь на ответе @azium, теперь я получаю:

Вышеупомянутая ошибка произошла в компоненте: в Connect (App) (созданном Route) в Route (созданном withRouter (Connect (App))) в withRouter (Connect (App)) в Router (созданном BrowserRouter) в BrowserRouter в PersistGate в Провайдере

При таком вызове из App.js:

@withRouter
@connect((store) => {
  return {
    isAuthenticated: store.auth.isAuthenticated,
  };
})

javascript react-redux redux-persist
person galgo    schedule 21.12.2017    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Если вы хотите использовать экспорт по умолчанию, вам необходимо изменить:

export const configureStore = () => {
  const store = createStore(reducers, middleware);
  const persistor = persistStore(store);
  return { persistor, store };
};

to: 

export default () => {
  const store = createStore(reducers, middleware);
  const persistor = persistStore(store);
  return { persistor, store };
};

or:

const configureStore = () => {
  const store = createStore(reducers, middleware);
  const persistor = persistStore(store);
  return { persistor, store };
};

export default configureStore;

или если вы не хотите использовать изменение экспорта по умолчанию:

import configureStore from './store';

to:

import { configureStore } from './store';
person azium    schedule 21.12.2017
comment
Спасибо, я попробовал, но не говорит, что хранилище не определено, когда я его вызываю: @connect ((store) = ›{return {isAuthenticated: store.auth.isAuthenticated,};}) Проверьте обновление 1 - person galgo; 22.12.2017

arrow_upward
0
arrow_downward

Итак, после небольшого размышления и помощи сообщества мне удалось сузить проблему до моего объявления редуктора. Я объявлял редуктор в index.js с помощью combReducers, в то время как redux-persist говорит, что этого не должно быть.

Окончательный код index.js:

import user from './userReducer'
import auth from './authReducer'

export default ({
  user, auth
})
person galgo    schedule 27.12.2017