• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

redux toolkit으로 thunk를 실행하는 방법이 궁금합니다

23.06.19 16:52 작성 조회수 262

0

import { configureStore } from "@reduxjs/toolkit";
import { createWrapper } from "next-redux-wrapper";
import reducer from "../reducers";
import thunkMiddleware from "redux-thunk";

function getServerState() {
  return typeof document !== "undefined"
    ? JSON.parse(document.querySelector("#__NEXT_DATA__").textContent)?.props
        .pageProps.initialState
    : undefined;
}
const loggerMiddleware =
  ({ dispatch, getState }) =>
  (next) =>
  (action) => {
    console.log(action);
    return next(action);
  };
const serverState = getServerState();
console.log("serverState", serverState);
const makeStore = () => {
  configureStore({
    reducer,
    devTools: true,
    middleware: (getDefaultMiddleware) =>
      getDefaultMiddleware({
        thunk: {
          loggerMiddleware,
        },
      }),
    preloadedState: serverState, // SSR
  });
};

export default createWrapper(makeStore);

아런 코드에서 redux thunk를 실행하는 방법이 궁금합니다!

답변 1

답변을 작성해보세요.

0

음.. 여기 세팅이 끝나면 컴포넌트에서 createAsyncThunk로 만든 함수를 dispatch하면 됩니다.