Recoil 를 통해 전역으로 상태를 관리하면, 컴포넌트의 깊이와 UI의 구조에 관계없이 편리하게 상태를 사용하거나 변경할 수 있어서 편리합니다.
그런데 장점이자 주의할 점음 컴포넌트가 Unmount
될 때 useState hook 이라면 초기값으로 상태가 다시 할당 되겠지만, Recoil atom 은 그대로 상태가 유지됩니다.
만약 컴포넌트가 Unmount
가 되고, 상태를 초기값으로 할당 되어야 한다면 useEffect
hook 을 통해 해당 전역 상태를 return
의 callback 함수를 통해 초기값으로 변경해 주어야 합니다.
const [chk, setChk] = useRecoilState(chkState);
useEffect(() => {
return () => {
setChk(false); // 만약 지정된 초기값이 false 이면.
}
}, [])