본문 바로가기

Web/Redux

[Redux] 비동기 처리

- 비동기 처리의 경우 서버에서 데이터를 받아오는 것이기 때문에 성공/실패 경우를 고려해야 함

  * 로그인의 경우 로그인 / 로그인 중 / 로그아웃 중 이러한 액션이 추가로 필요함

 

- request 액션을 만들고 loading state를 추가하여 loading 효과를 넣으면 사용자 경험이 좋음

 

- saga에서 success와 failure 같은 경우는 비동기 호출 시 액션을 put으로 생성하기에 reducer에서 작성하지 않아도 됨

 

- 로그인 시뮬레이션 예

  1. 로그인 버튼 클릭

  2. 로그인 요청 액션 dispatch

  3. saga의 watchSignin이 실행되고 reducer의 로그인 요청 실행

  4. saga의 로그인 함수 실행

  5. 로그인 요청에서 받아온 action이 로그인 함수의 파라미터로 전달 됨

  6. 로그인 함수의 로그인 성공 액션 실행

  7. reducer에서 로그인 성공 실행

  8. view 변경

'Web > Redux' 카테고리의 다른 글

[Redux] redux-saga  (0) 2021.06.17
[Redux] dummy 데이터  (0) 2021.06.17
[Redux] reducer 분할하기  (0) 2021.06.17
[Redux] 원리 및 불변성  (0) 2021.06.17