Блог

Итак, я использую пример nextjs с-redux-saga, чтобы выяснить, как я могу вызвать store.getState в _app.js файл внутри componentDidMount ?

Это конфигурация хранилища:

 import { applyMiddleware, createStore } from 'redux'
import createSagaMiddleware from 'redux-saga'
import { createWrapper } from 'next-redux-wrapper'

import rootReducer from './reducer'
import rootSaga from './saga'

const bindMiddleware = (middleware) => {
  if (process.env.NODE_ENV !== 'production') {
    const { composeWithDevTools } = require('redux-devtools-extension')
    return composeWithDevTools(applyMiddleware(...middleware))
  }
  return applyMiddleware(...middleware)
}

export const makeStore = (context) => {
  console.log(context, 'contextcontext')
  const sagaMiddleware = createSagaMiddleware()
  const store = createStore(rootReducer, bindMiddleware([sagaMiddleware]))

  store.sagaTask = sagaMiddleware.run(rootSaga)

  return store
}

export const wrapper = createWrapper(makeStore)
 

и это _app.js файл:

 import { wrapper } from '../store'
import React from 'react';
import App from 'next/app';

class MyApp extends App {
  static getInitialProps = wrapper.getInitialAppProps(store => async ({Component, ctx}) => {
    return {
      pageProps: {
        ...(Component.getInitialProps ? await Component.getInitialProps({...ctx, store}) : {}),
        pathname: ctx.pathname,
        store,
      },
    };

  });


  componentDidMount() {
    // call store.getState here <======
  }

  render() {
    const {Component, pageProps} = this.props;
    return (
      <Component {...pageProps} />
    );
  }
}

export default wrapper.withRedux(MyApp);
 

Версии:

   "dependencies": {
    "next": "latest",
    "next-redux-wrapper": "^7.0.5",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-redux": "7.2.0",
    "redux": "^4.1.2",
    "redux-saga": "^1.1.3"
  },
 

Дело в том, что когда я регистрирую хранилище в componentDidMount, оно показывает только sagaTask, но не другие методы хранения на стороне клиента:

Любая помощь или подсказка будут высоко оценены.