实现 Store

虽然库带有一些内置的 Store，但您可以使用 <RecoilSync> 来实现自己的 Store。指定一个可选的 storeKey 来标识和匹配哪些原子应该与哪个 Store 同步。然后，指定以下可选回调来定义 Store 的行为

• read - 如何从外部 Store 读取单个项目，例如初始化原子时。
• write - 如何将变异的原子状态写入外部 Store。
• listen - 如何订阅来自 Store 的异步更新以变异原子状态。

有关回调的完整详细信息，请参阅 <RecoilSync> API 参考。

使用 React Props 同步的示例

一个使用 <RecoilSync> 的示例 Store，它将根据 React 属性值初始化原子

function InitFromProps({children, ...props}) {
  return (
    <RecoilSync
      storeKey="init-from-props"
      read={itemKey => props[itemKey]}
    >
      {children}
    </RecoilSync>
  );
}

使用用户数据库同步的示例

一个使用 <RecoilSync> 的示例 Store，它将与自定义数据库同步

function SyncWithDB({children}) {
  const connection = useMyDB();
  return (
    <RecoilSync
      storeKey="my-db"
      read={itemKey => connection.get(itemKey)}
      write={({diff}) => {
        for (const [key, value] of diff) {
          connection.set(key, value);
        }
      }}
      listen={({updateItem}) => {
        const subscription = connection.subscribe((key, value) => {
          updateItem(key, value);
        });
        return () => subscription.release();
      }}
    >
      {children}
    </RecoilSync>
  );
}