使用法

// リアクティブな状態を作成し、デフォルト値を設定
const count = useState('counter', () => Math.round(Math.random() * 100))

shallowRef の使用

状態を深くリアクティブにする必要がない場合は、useState を shallowRef と組み合わせることができます。これにより、状態に大きなオブジェクトや配列が含まれる場合のパフォーマンスが向上します。

const state = useState('my-shallow-state', () => shallowRef({ deep: 'not reactive' }))
// isShallow(state) === true

型

useState<T>(init?: () => T | Ref<T>): Ref<T>
useState<T>(key: string, init?: () => T | Ref<T>): Ref<T>

• key: データフェッチがリクエスト間で適切に重複排除されることを保証する一意のキー。キーを指定しない場合、useState のインスタンスのファイルと行番号に固有のキーが生成されます。
• init: 状態が初期化されていないときに初期値を提供する関数。この関数は Ref を返すこともできます。
• T: （TypeScript のみ）状態の型を指定します。