-
카테고리
-
세부 분야
풀스택
-
해결 여부
해결됨
redux thunk 원리 질문
23.07.11 23:13 작성 조회수 246
0
1.
thunk를 사용하면 함수형 action을 dispatch 했을때action을 단순히 실행하는 것으로 보이는데요.
그렇다면 아래 두 코드처럼
함수형 action을 dispatch하는 방식과
함수로 감싸지 않고 하는 방식과 결과는 같다고 생각되는데 맞나요?
const loginAction = () => {
return (dispatch) => {
dispatch(loginRequestAction());
axios.post('/api/login')
.then((res) => {
dispatch(loginSuccessAction(res.data));
})
.catch((err) => {
dispatch(loginFailureAction(err));
})
}
}
const onClickLogin = () => {
dispatch(loginAction());
}
const onClickLogin = () => {
dispatch(loginRequestAction());
axios.post('/api/login')
.then((res) => {
dispatch(loginSuccessAction(res.data));
})
.catch((err) => {
dispatch(loginFailureAction(err));
})
}
2.
1이 맞다면 함수 action을 dispatch하는 방식은 편의성 때문이라고 봐도 될까요?
3.
강의 10:40 쯤에 thunk는 한번에 dispatch를 여러번 할 수 있게 해준다고 하셨는데
thunk없이 아래처럼 여러번 쓰는 것은 문제가 될 수 있나요?
// action은 임의로 지었습니다
const onClickButton = () => {
dispatch({type: 'CHANGE_ID'});
dispatch({type: 'CHANGE_PASSWORD'});
}
답변을 작성해보세요.
1
조현영
지식공유자2023.07.11
네 동작은 같습니다.
로직의 분리때문입니다. api 요청과 비즈니스로직을 컴포넌트에서 분리하는 것이죠
별 문제 없습니다. 다만 상황에 따라 리렌더링이 두 번 될 수는 있습니다.
답변 1