[Recoil] What is atom (options) ?

atom(options)
atomはRecoilの状態を表します.atom()関数は、書き込み可能なRecoilstateオブジェクトを返します.

function atom<T>({
  key:string,
  default:t | Promise<T> | RecoilValue<T>,
  
  effects_UNSTABLE?; $ReadOnlyArray<AtomEffect<T>>,
  
  dangerouslyAllowMutability?:boolean,
}):RecoilState<T>

key
内部原子を識別するための一意の文字列

この文字列は、アプリケーション全体の他の原子およびセレクタに対して一意の

である必要があります.
default

原子の初期値またはPromiseまたは同じタイプの値を表す他の原子またはセレクタ

effects_UNSTABLE

AtomのオプションAtom Effectsアレイ.

dangerouslyAllowMutability

Recoilは、原子の状態変化に依存し、原子を使用して再レンダリングされた構成部品をいつ通知すべきかを知る.atomの値が変更された場合、登録された構成部品に通知せずにステータスが変更される可能性があります.格納されているすべての値は、このような状況を防止するために変更されません.場合によっては、このオプションを使用してこのオプションを再定義できます.

atomとのインタラクションで最もよく使われるHooks
useRocoilState()
atomの読み取りと書き込みに使用します.このHookでは、atomに構成部品を登録できます.
useRecoilValue()
読み取り専用atomに使用します.このHooksでは、atomに構成部品を登録する必要があります.
useSetRecoilState()
atomへの書き込み試行時のみ使用
useResetRecoilState()
atomを初期値に初期化するには
useRecoilCallback()
構成部品が登録されておらず、atom値を読み込む必要がある場合に使用される珍しい場合
🧸 静的値を使用してatomを初期化するか、同じタイプの値を表す規則またはRecoilValueを使用して原子を初期化できます.
Promiseが保留中であるか、デフォルトのセレクタが非同期である可能性があるため、atomの値が保留中であるか、読み取り中にエラーが発生する可能性があります.
現在atomを設定している場合、Promiseは指定できません.
セレクタを使用して非同期関数を使用します.
AtomはPromiseまたはRecoilValueを直接保存することはできませんが、オブジェクトを非表示にすることもできます.
Promisesが変わる可能性があることに注意してください.
Atomはfunctionに設定できますが、関数が純粋な関数である場合はsetter形式のupdaterを使用する必要がある場合があります.(例えばset(myAtom,()=>myFunc);)
例

import {atom, useRecoilState} from 'recoil';

const counter = atom({
  key: 'myCounter',
  default: 0,
});

function Counter() {
  const [count, setCount] = useRecoilState(counter);
  const incrementByOne = () => setCount(count + 1);

  return (
    <div>
      Count: {count}
      <br />
      <button onClick={incrementByOne}>Increment</button>
    </div>
  );
}