• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    해결됨

dispatch로 데이터를 넘겨주는 과정 질문

23.06.28 15:07 작성 조회수 217

0

제가 redux toolkit을 이용해서 제로초님 강의를 따라가고 있는데 dispatch로 데이터를 넘겨주는 과정중에 이해가 잘 안되는 부분이 있어서 질문드립니다

로그인을 하는 과정인데

LoginForm.js
  
const onSubmitForm = useCallback(() => {
    console.log(email, password);
    dispatch(
      loginAction({
        email,
        password,
      })
    );
  }, [email, password]);
user.js

export const loginAction = createAsyncThunk(LOG_IN, async (data) => {
  await wait(1000);
  return data;
});
....
.addCase(loginAction.fulfilled, (state, action) => {
        state.logInLoading = false;
        state.logInDone = true;
        state.user = dummyUser;
        state.loginData = action.data;
      })

GOMCAM 20230628_1501040806.png

이렇게 두부분의 코드로 아래의 action 과정이 일어나는데 LoginForm.js에서 dispatch로 email, password를 넘겨주었는데 딱히 user.js에서 이를 처리하는 코드는 보이지 않습니다 redux devtools에서는 payload에 email과 password를 받은것은 확인이 되는데 말입니다

그리고 저는 initialState에 email과 password를 설정하지 않았습니다

export const initialState = {
  logInLoading: false, // 로그인 시도중
  logInError: null, // 로그인 에러
  logInDone: false, // 로그인 상태 체크
  logOutLoading: false, //로그아웃 시도중
  logOutError: null, // 로그아웃 에러
  signUpLoading: false, // 회원가입 시도중
  signUpDone: false, // 회원가입 상태 체크
  signUpError: null, // 회원가입 에러
  user: null,
  signUpData: {},
  loginData: {},
};

이렇게 되면 payload에 들어있는 email과 password는 어디에 어떻게 저장이 되는걸로 생각을 해야하나요?

답변 1

답변을 작성해보세요.

0

loginAction reducer에 따라 이니셜스테이트에 저장됩니다. 객체니까 자유롭게 데이터를 추가할 수 있어요. reducer에 저 값들을 저장하는 코드를 안 적었다면 스테이트에 저장되지 않고요.

i1004gy님의 프로필

i1004gy

질문자

2023.06.29

LoginForm.js
  
const onSubmitForm = useCallback(() => {
    console.log(email, password);
    dispatch(
      loginAction({
        email,
        password,
      })
    );
  }, [email, password]);

그렇다면 이렇게 작성을 하면 action.payload에 email과 password가 저장이 되지만 제가 initalstate에 따로 저장하는 코든는 작성하지 않았기에 창이 새로고침 된다는가 하면 payload에 저장된 email과 password는 사라지는 건가요?

네 사라집니다. 참고로 저장여부와 상관없이 어차피 새로고침하면 state는 초기화됩니다