react-hook-formでSet型が使えない

react-hook-formでSet型が使えない理由まとめ

問題

• react-hook-form でフォーム値を Set 型（例: Set<string>）で管理しようとすると、
  値が {}（空のオブジェクト）になってしまい、意図通りに動作しない。

原因

• react-hook-form はフォーム値を「シリアライズ可能な値（JSON化できる値）」として管理する。
• Set 型はJSONに変換できない（JSON.stringify(new Set()) は "{}" になる）。
• そのため、Set を使うと内部的にただの空オブジェクトとして扱われ、
  Set 本来のメソッドやイテレータが使えなくなる。

具体例

• useForm の defaultValues で unit_ids: new Set<string>() のように初期化しても、
  実際には {} になってしまう。
• Controller の field.value も Set ではなく {} になるため、
  [...field.value] などの操作でエラーになる。

解決策

• フォーム値は string[]（配列）で管理し、必要な場面で Set に変換して使うのがベストプラクティス。
• どうしても Set で扱いたい場合は、onChange で配列⇔Setの変換を都度行う。

まとめ

• react-hook-form で Set 型は直接使えない。
• 配列で管理し、必要に応じて Set に変換するのが安全。