zustand를 사용하면서 알게된점들, 콜백 함수의 정의 재정립 , 상태관리 변수(인자값) 에 대해 알아보자.

zustand를 사용하면서 헷갈리는 것들이 있었다.

예를 들면 zustand가 아니고 원래 상태관리를 할때에는 아래처럼 쓰는데

const [count, setCount] = useState(0);

// 이전 상태에 의존하여 상태를 업데이트
setCount(previousCount => previousCount + 1);

 

zustand에서는 이런식으로 사용하는 부분이다.

set(state => ({ count: state.count + 1 }));

 

이부분에서 내가 헷갈렸던 것은 previousCount 부분이다.

여기서 이 변수가 어디서 나온건지도 헷갈리고 뭘하고싶은지가 정립이 안되었었다.

 

여기서 나오는 previousCount는 결국 내가 지정하는 변수명이다. 

즉

const [count, setCount] = useState(0);

// 아래에서 "c"는 현재 count 상태의 값을 나타내며, 매개변수 이름을 어떻게 지정하든 상관없습니다.
setCount(c => c + 1);

 

이렇게 적어도 된다는 말씀. 

 

• 콜백 함수의 매개변수로 현재 상태의 값을 받습니다.
• 이 매개변수의 이름은 개발자가 자유롭게 지정할 수 있습니다.
• 이 매개변수를 사용하여 필요한 상태 업데이트 로직을 구현합니다.