redux-saga

Tony·2021년 7월 28일
0

react

목록 보기
11/86

redux가 처음 접할 땐 복잡해서 어렵게 느껴지는데
saga 라는 것 까지 더 해지니 더 복잡해 보였다.

그런데 알고보면 그렇게 어려운 개념은 아니었다.
saga는 단지 redux가 한번의 이벤트로 두가지 이상 action을 실행해야 할 때 사용하면 좋다.

saga는 리덕스가 스토어를 생성할 때 미들웨어로 장착해서 사용하면 된다.
dispatch가 액션을 전달(reducer와 saga에 동시에 전달, reducer가 약간 더 빠르게 전달받음)

  • reducer로 전달
  • 미들웨어인 saga로 전달이 된다.

saga에서 설정한 이벤트리스너와 비슷한 effect들이 action이 들어오는 것을 watch하고 있다가 dispatch에 의해 action이 reducer로 전달 되기전에 미들웨어인 saga로 들어오면

effect에 의해 트리거된 제너레이터 함수가 순차적으로 여러 action을 실행한다.

제너레이터 함수 안의 put이펙트가 dispatch와 같이 action을 reducer로 전달을 하고

reducer안의 switch 문에 의해 state값이 변화하게 된다.

각 컴포넌트에서 useSelector를 이용하여 리덕스의 state를 참조하고 있다가
state가 변함에 따라 렌더링이 다시 발생한다.

코드로 자세히 보기

profile
움직이는 만큼 행복해진다

0개의 댓글