인프런 커뮤니티 질문&답변
작성한 질문수
6.8 zustand 강의에서 devtools 미들웨어에 대한 질문입니다.
작성
·
96
·
수정됨
1
zustand 강의에서 devtools 미들웨어를 사용하여
브라우저 도구 Redux 툴에서 Action 과 State 를 살펴보는데 강의 영상에서는 Action의 이름이 setSession 으로 나오는 데...
제 Redux 툴에서는 액션 명이 anonymous로 표시됩니다. 어떻게 액션명이 표시되는 지 궁금합니다.
set 함수에서 액션명 표시하려면 이름을 주어 표시했는데 . 뭔가 다른가요 ?
//...
set({session, isLoaded: true}, undefined, 'setSession');
//...답변 2
1
이정환 Winterlood
지식공유자
안녕하세요 coding bear님 이정환입니다.
우선 기본적으로 Redux Devtools에는 스토어의 actions 객체 내부에 정의된 액션 함수의 이름이 표시됩니다. 만약 그렇지 않을 경우 앱이 개발 과정에서 정상적으로 로딩되지 않았을 수 있으니 새로고침 하신 다음 진행해보시면 정상적으로 잘 뜨는 경우가 꽤 있습니다.
그런데 이때! persist 미들웨어를 사용하게 될 경우 zustand 내부적인 이슈로 인해 액션 함수의 이름이 자동으로 잘 추론되지 않는 경우가 있다고 합니다. 이럴 경우 말씀하신 것 처럼 set 메서드의 인수로 액션 함수의 이름을 전달해주시면 됩니다.
0
저도 강의 수강하다 같은 문제가 있어서 해결방법 남겨봅니다
- https://zustand.docs.pmnd.rs/middlewares/devtools#all-action-names-are-labeled-as-'anonymous'
```ts
const useSessionStore = create(
devtools(
combine(initialState, (set) => ({
actions: {
setSession: (session: Session | null) => {
set({ session, isLoaded: true }, undefined, "actions.setSession");
},
},
})),
),
);```