redux-toolkit 하나의 상태변화로 다른 상태 변화 일으키기

https://www.youtube.com/watch?v=oEEXhHy_i4I&ab_channel=Covalence

리덕스 툴킷을 사용해 보았을 때의 장점은 slice를 통해 필요한 단위로 상태 구획을 정의하고, 선언적으로 상태를 변경할 수 있다는 점이었다.

그런데 궁금한 점, A slice 의 상태변화가 일어나면 B slice, C slice상태도 변해야 하는 경우가 있다.

상태가 얼기설기 섞여 있고, 한 상태가 다른 상태에 의존성을 가지고 있는 경우이다.

이런 경우 리덕스 툴킷에서는 어떻게 상태 변경을 설계하고 트리거할 수 있을까?

정답은 ExtraReducer이다.

단순히 async 요청의 결과를 수행하면서 Promise의 상태 변화를 추적하는 것 뿐 아니라, 다른 slice의 액션타입을 감지해서 상태변화를 일으키는 것도 가능하다!

A slice에서 상태변화를 일으키는 액션타입명을 'A/changeIdNumber'라고 가정해보자.

그러면 B, C slice의 extrareducers에서 builder 케이스로 'A/changeIdNumber' 를 등록해주고(감시) 해당 액션 타입이 발생했을 때 상태변화 로직을 명시해주면된다.

createAsyncThunk 에서 thunkApi.{다른슬라이스}.디스패치액션

을 실행해도 가능하다. 이 안에서 실행하는 것은 사이드 이펙트가 아니다!

리덕스 툴킷은 알면 알수록 재밌다. 끝!