인프런 커뮤니티 질문&답변
작성한 질문수
saga 비동기 처리에서 페이지 이동
작성
·
303
0
saga에서 비동기 통신으로 성공 또는 실패로 나뉘는데
try_catch에서 통신이 성공하면
어디에서 페이지를 이동하는 코드를 작성해야 하나요?
1. component
dispatch({
type: UPLOAD_REQUEST
data: index
})
// Router.push("/upload")
2. saga
function* addItem(action) {
try {
const result = yield call(api)
yield put({
type: UPLOAD_SUCCESS
data: result.data
})
// Router.push("/upload")
} catch (err) {
yield put({
type: UPLOAD_FAUILRE
error : err.response.data
})
}
}
API 통신에 경고문(alert) 창도
성공 또는 실패에 따라 유동적으로 달고 싶은데
조건을 어떻게 주고 어느 파일에 다는지 궁금합니다.
답변 1
0
제로초(조현영)
지식공유자
정해진 건 없고 한 군데로 통일하면 됩니다. 다만 리덕스 툴킷을 사용하지 않으면 컴포넌트에서 성공/실패 후처리를 하는 게 조금 어렵습니다. 보통 거기서 라우터 전환이나 얼럴트를 하거든요.
페이지를 넘길 때 컴포넌트 안에서만 Router.push 되더라고요
밖에 saga, reducer 먹지 않아서
구글링 해보니 store 안에 history 연결을 해서 페이지를 이동하더라구요
그래서 제가 한 방식은
const router = uesRouter( );
const onClickEvnet = useCallback(( ) => {
const history = router;
dispatch({
type: UPLOAD_REQUEST,
history,
})
})
history 넘어온 객체를 통해서 saga에서 history.push("/")를 하면 되더라구요
근데 이렇게 하면 단점은 페이지를 이동할 경우에 계속 history를 넣어줘야 한다는 단점이 있어요,