Использование инструментов Redux с Next JS: как узнать, что происходит в хранилище, когда Redux называется серверной частью?

Question

У нас есть приложение Next JS, использующее next-redux-wrapper и Redux thunks. У нас есть страница, которая прекрасно работает, когда мы загружаем страницу по локальной ссылке, то есть она отображается локально, но когда мы перезагружаем страницу, то есть отображаем ее на сервере, наше хранилище остается (частично) пустым: некоторые поля никогда не бывают пустыми. заполнено.

Я использую инструменты разработки Redux для отслеживания действий, но все, что я когда-либо вижу при перезагрузке страницы в списке действий, это @@init. Когда я помещаю в журнал операторы, я вижу - в консоли на стороне сервера - что мой редуктор вызывается с допустимыми значениями. Однако это поле остается пустым в хранилище, как показывает RDT в браузере.

Действия Redux не отображаются в консоли Redux Dev Tools браузера, поскольку они происходят на сервере.

Магазин настроен как next-redux-wrapper, инструктирует

// _app.ts
import withRedux from 'next-redux-wrapper';
import initStore from '../redux/store';

const makeStore = initialState => {
  return initStore(initialState);
};

const MyApp = ({ Component, pageProps, apollo, store }: Props) => {
  return (
    <ApolloProvider client={apollo}>
      <Provider store={store}>
        <Sidebar />
        <Component {...pageProps} />
      </Provider>
    </ApolloProvider>
  );
};

MyApp.getInitialProps = async appContext => {
  const { Component, ctx } = appContext;
  const appProps = await App.getInitialProps(appContext);
  const pageProps = Component.getInitialProps
    ? await Component.getInitialProps(ctx)
    : {};

  const allProps = {
    ...appProps,
    ...pageProps
  };
  return { ...allProps };
};
export default withRedux(makeStore)(withApollo(MyApp));

Как я могу выяснить, что происходит в моем магазине Redux, если я не могу использовать Redux Dev Tools, чтобы увидеть? Что я хотел бы сделать, так это выяснить , где и , когда значения, которые передаются в редукторы, перезаписываются пустым значением.

Answer 1

Ответ оказался таковым, что я отправлял Thunk на стороне сервера Thunk, и я полагаю, что результат не вернулся вовремя, чтобы передать его в хранилище со следующего сервера JS на клиент , Когда я сделал прямой, asyn c звонок в моем thunk, все работало нормально.