Named State

同じ名前で呼び出すと同じシングルトンストアが返されます。

コンポーネント内部呼び出しを基準に設計されたnamed mode

Named modeはReactコンポーネント内部で簡単に使用できます。同じ名前と同じストレージオプションを使用すると同じエントリと同じ返却オブジェクトを再利用します。数値の増加のように前の値に依存する更新は setCount((prev) => prev + 1) 形式で記述してください。

tsx

import { createRxState } from "@byeolnaerim/global-rx-state";

function A_Component() {
  const { setCountInner, useCountInner } = createRxState(0, "countInner", { storage: "auto" });
  const countInner = useCountInner();

  return (
    <button onClick={() => setCountInner((prev) => prev + 1)}>
      {countInner}
    </button>
  );
}

function B_Component() {
  const { useCountInner } = createRxState(0, "countInner", { storage: "auto" });
  const countInner = useCountInner();

  return <span>현재 count: {countInner}</span>;
}