Реагировать на Redux Persist - PullRequest
0 голосов
/ 27 апреля 2018

Я только начал использовать Redux Persist, и по какой-то причине я не могу заставить его работать. (Невозможно прочитать свойство «подписаться» на неопределенную ошибку)

Persistor.js

import { createStore } from 'redux'
import { persistStore, persistReducer } from 'redux-persist'
import store from 'redux-persist/es/storage/session' // defaults to 
localStorage for web and AsyncStorage for react-native

import rootReducer from './reducers'

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

const persistedReducer = persistReducer(persistConfig, rootReducer)

export default () => {
   let store = createStore(persistedReducer)
   let persistor = persistStore(store)
   return { store: store, persistor: persistor }
}

index.js

import React from 'react';
import App from './components/App/App';
// import registerServiceWorker from './registerServiceWorker';
import { render } from 'react-dom'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
import { PersistGate } from 'redux-persist/integration/react'
import persistor from './Persistor'
import rootReducer from './reducers'
import 'bootstrap/dist/css/bootstrap.min.css'
import './index.css'

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

с нормальным Redux работает нормально. Но как только я попытался переключить Persist Redux, я получил ошибку, которую я написал выше.

1 Ответ

0 голосов
/ 27 апреля 2018

Значение персистора, которое вы импортируете в индекс, не является объектом. Это функция, которая возвращает объект, содержащий хранилище и персистор.

Создание функции персистора, а также замена значений, назначенных для сохранения в провайдере, с персистором в персистенте.

Переименуйте ваш импорт во что-то вроде configureStore, чтобы предотвратить любой конфликт.

const { store, persistor } = configureStore()

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