RecoilRoot 학습

RecoilRoot

Atom 컨텍스트를 제공해주는 Root.

Recoil의 hook을 사용하는 모든 Component의 조상이다.
여러개의 Root가 함께 존재할 수 있다.
Atom은 각각의 Root안에 존재한다.

override 속성

기본값은 true.
RecoilRoot가 중첩되어 있을 때 영향을 준다.

만약 override=true 라면 RecoilRoot는 새로운 Scope를 생성한다.
따라서 A RecoilRoot의 atom 과 B RecoilRoot의 atom은 서로 다른 값을 가지게 된다.

캐시 값들은 루트사이에 공유된다.

import {RecoilRoot} from 'recoil';

function AppRoot() {
  return (
    <RecoilRoot>
      <ComponentThatUsesRecoil />
    </RecoilRoot>
  );
}

참고 | 공식문서