코드코코

[리액트] Immer 본문

기록/정리

[리액트] Immer

코드코코 2021. 10. 25. 00:39

Immer

- 상태를 업데이트 할 때, 불변성을 신경쓰지 않으면서 업데이트를 해도 Immer 가 불변성 관리를 대신 해준다

 

//불러오기
import produce from 'immer';



const state = {
  number: 1,
  dontChangeMe: 2
};

//첫번째 파라미터에는 수정하고 싶은 상태
//두번째 파라미터에는 어떻게 업데이트하고 싶을지 정의하는 함수
//두번째 파라미터에 넣는 함수에서는 불변성에 대해서 신경쓰지 않고 
//그냥 업데이트 해주면 다 알아서 처리해줌
const nextState = produce(state, draft => {
  draft.number += 1;
});

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

출처

https://react.vlpt.us/basic/23-immer.html

 

23. Immer 를 사용한 더 쉬운 불변성 관리 · GitBook

23. Immer 를 사용한 더 쉬운 불변성 관리 리액트에서 배열이나 객체를 업데이트 해야 할 때에는 직접 수정 하면 안되고 불변성을 지켜주면서 업데이트를 해주어야 합니다. 예를 들자면 다음과 같

react.vlpt.us

 

'기록 > 정리' 카테고리의 다른 글

[리액트] Sass(Syntactically Awesome Style Sheets)  (0) 2021.10.26
[리액트] import * as React from 'react';  (0) 2021.10.25
[리액트] Context API  (0) 2021.10.24
[리덕스] 리덕스 알아보기  (0) 2021.10.24
[리액트] Hook  (0) 2021.10.24