Redux 와 immer 라이브러리 사용하기

Jaewoong2·2020년 6월 28일
0

Redux

목록 보기
1/5
post-custom-banner

보통 Reducer 를 할 때, 불변성 관리를 해줘야한다.

예를 들어

const my : {
	name : '1234', number : '1'	
        }
const newMy : {
	...my,
    name: '제이름 입니다'
}

이렇게 객체를 다룰때는, 새로운 객체로 만들어줘서 불변성을 관리해줘야 하는데,

redux의 reducer를 사용하다보면 불변성 관리하기가 힘들 떄가 있다.

그래서 사용 하는 것이 immer 라이브러리다.

npm i immer
import producer from 'immer'

const reducer = (state = initalState, action) => {
    return produce(state, (draft) => {

        switch (action.type) {
            case CHANGE_NUMBER:
                draft.my.number = '1234';
                break;

            default:
                break;
        }
    })
}

는 이렇게도 표한 가능하다.

const reducer = (state = initalState, action) =>  produce(state, (draft) => {

        switch (action.type) {
            case CHANGE_NUMBER:
                draft.my.number = '1234';
                break;

            default:
                break;
        } 
    });
profile
DFF (Development For Fun)
post-custom-banner

0개의 댓글