[Redux] immer

JIOO·2022년 10월 12일
0

React

목록 보기
10/18

설치 준비

npm install immer 
import produce from "immer";

✔ 사용법

const states = {
  number: 1,
  constVariable: 2
};

const nextState = produce(prevState, draft => { 
  draft.number += 1;
});

// 상태를 어떻게 업데이트 할건지 :draft 

console.log(nextState);
// result : { number: 2, dontChangeMe: 2 }

✔ 사용해보기

const initialState = { data:"", isState : false}

reducer 함수 변경 
function reducer(state = initialState,action){
 switch(action.type) {
   case "testCase" :
    return {
     ...state,
     isState : !state.isState
    }
 }
} 

↓

const useReducer = (prevState = initialState, action) => {
 	return produce(prevState,(draft)=>{
      switch(action.type) {
        case "testCase" :
         return {
          draft.data = null;
          draft isState = true;
          break;
       }
       default :
      	 return break;
     }
    });
}
profile
프론트엔드가 좋은 웹쟁이

0개의 댓글