Question

我刚刚开始使用Redux Persist，由于某种原因我无法使用它。（无法读取未定义错误的属性'subscribe'）

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时，我得到了上面写的错误。

Answer 1

您在索引中导入的persistor值不是对象。它是一个返回包含存储和持久性的对象的函数。

实例化persistor函数，然后在persistgate中将指定存储在Provider中的值与persistor一起交换。

将您的导入重命名为configureStore，以防止任何冲突。

const { store, persistor } = configureStore()

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

React Redux Persist

1 个答案: