<RecoilRoot>

提供原子具有值的環境。必須是使用任何 Recoil 鉤子之任何元件的祖先。

---

道具

• initializeState?: (MutableSnapshot => void)
  • 選用的函式，採取 MutableSnapshot 來 初始化 <RecoilRoot> 原子狀態。這為初始渲染設定狀態，不用於後續的狀態變更或非同步初始化。請使用諸如 useSetRecoilState() 或 useRecoilCallback() 的鉤子，進行非同步狀態變更。 原子效果 可用於更輕鬆地初始化動態原子，並將初始化邏輯與原子定義共置。原子效果初始化優先於 initializeState。
• override?: boolean
  • 預設為 true。此道具僅在這個 <RecoilRoot> 嵌套在另一個 <RecoilRoot> 內時才重要。如果 override 為 true，此根部將建立新的 Recoil 範圍。如果 override 為 false，此 <RecoilRoot> 將不執行任何功能，除了呈現其子項之外，因此此根部的子項將存取最近祖先 RecoilRoot 的 Recoil 值。

使用多個 <RecoilRoot>

多個 <RecoilRoot> 可以共存並代表 atom 狀態的獨立提供者/儲存；在每個根元素中，atom 都會具有獨特的值。這個動作在您將一個根元素放入另一個根元素中時保持相同（內部的根元素會遮罩外部根元素），除非您將 override 指定為 false（請參閱「屬性」）。

請注意，例如選擇器快取的快取，都可以在根元素之間共享。選擇器評估必須是冪等，唯快取或記錄除外；因此，這通常不會是問題，但這仍然是可以觀察到的現象，可能會導致在根元素之間快取了重複的查詢。快取可以使用 useRecoilRefresher_UNSTABLE() 清除。

範例

import {RecoilRoot} from 'recoil';

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