[React]Cool한 State 관리 라이브러리 recoil

매우매우매우 간단하고 직관적인 State 관리 라이브러리 recoil를 배워서 정리

---

State 선언(atoms)

선언 코드

import { atom } from "recoil"

export const isDarkAtom = atom ({
    key : "isDark",
    default : false,
})

---

State 불러오기

import { useRecoilValue } from 'recoil';
import { isDarkAtom } from './routes/atoms';

...
  const isDark = useRecoilValue(isDarkAtom);
...

---

set함수 불러오기

import { useSetRecoilState } from "recoil";
import { isDarkAtom } from './atoms';

...
const setIsDarkFn = useSetRecoilState(isDarkAtom);
...
<button onClick={() => setIsDarkFn((prev) => !prev)}>Dark toogle</button>
...

---

 

좋다...이렇게 직관적인 라이브러리가 있을 줄이야!!!