본문 바로가기

기록/TIL

2023.08.18 - jotai 기본적인 사용법

Jotai?

Jotai는 Recoil에 영감을 받아 만들어진 상태 관리 라이브러리이다.

Jotai는 미니멀 API를 지향하며, TypeScript 기반이다. React의 useState와 유사하게 사용이 가능하다.

useSetAtom, useAtomValue를 통해 리렌더링 문제를 줄일 수 있다.

모든 상태는 전역적으로 접근가능하다!!

 

 

jotai 정말 기본적인 사용 방법.

 

1. atom

const countAtom = atom(0);

atom(state)를 생성하고, 초기값을 괄호안에 넣는다.

 

 

2. useAtom( read / write )

const [count, setCount] = useAtom(countAtom);

1에서 생성한 atom 을 불러와 useState 와 동일하게 사용 가능하다.

 

 

3. useSetAtom( write )

const setCount = useSetAtom(countAtom);

atom 의 값을 update 할 때 사용한다.

 

 

4. useAtomValue(read)

const count = useAtomValue(countAtom);

atom 의 값을 read  할 때 사용한다.

 

useSetAtom, useAtomValue는 useAtom과는 다르게 리렌더링이 발생하지 않는다.