Как подключить Middleware и redux-persis - PullRequest
Новая
       22

Как подключить Middleware и redux-persis

0 голосов
/ 08 апреля 2020

Как я могу подключить Middleware и redux-persis? Ниже мой индекс. js и магазин. js, я не знаю, насколько правильно я могу их соединить. Теперь у меня есть ошибка «Uncaught TypeError: Не удается прочитать свойство« dispatch »из неопределенного» Как я могу это исправить? Спасибо!

магазин 

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

const persistedReducer = persistReducer(persistConfig, Reducer);
const persistor = persistStore(store);


const composeEnhancers =
  typeof window === 'object' &&
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?   
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
    }) : compose;


const store = createStore(
    persistedReducer,
    composeEnhancers(
        applyMiddleware(thunk)
    )
)

export {store, persistor};

index. js

import {BrowserRouter} from "react-router-dom";
import {Provider} from "react-redux";
import {store, persistor} from "./Store/store.js";
import {PersistGate} from "redux-persist/integration/react";

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

ReactDOM.render(app, document.getElementById("root"));

1 Ответ

1 голос
/ 08 апреля 2020

Похоже, вы пытаетесь сохранить магазин, прежде чем создать его. Я бы предложил перейти в предварительно загруженное состояние: 

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

const persistedReducer = persistReducer(persistConfig, Reducer);
const preloadedState = {
  // Fill out accordingly
}

const composeEnhancers =
  typeof window === 'object' &&
  window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?   
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
    }) : compose;


const store = createStore(
    persistedReducer,
    preloadedState,
    composeEnhancers(
        applyMiddleware(thunk)
    )
)

const persistor = persistStore(store);

export {store, persistor};
...