
フォームと Controlled Components
Controlled components、uncontrolled components、フォームバリデーション、React Hook Form、submit の処理
1React における controlled component とは何ですか?
React における controlled component とは何ですか?
回答
Controlled component とは、value prop と onChange ハンドラーを通じて React の state によって値が管理されるフォーム要素です。つまり、React がそのデータの信頼できる唯一の情報源となります。DOM が独自の値を保持する uncontrolled components とは異なり、controlled components はフォームデータを完全に制御でき、リアルタイムバリデーションを容易にします。
2React で controlled input を作成するにはどうしますか?
React で controlled input を作成するにはどうしますか?
回答
Controlled input には2つの必須要素が必要です:React の state にバインドされた value prop と、その state を更新する onChange ハンドラーです。onChange がなければ、React が変更を防止するため input は読み取り専用になります。このアプローチにより、React の state は表示されている input の値と常に同期され、即時バリデーションやデータ変換が可能になります。
3Controlled component と uncontrolled component の違いは何ですか?
Controlled component と uncontrolled component の違いは何ですか?
回答
根本的な違いはデータの信頼できる情報源にあります。Controlled component は値を React の state(信頼できる唯一の情報源)に格納しますが、uncontrolled component は DOM に独自の値を管理させ、ref を通じてアクセスします。Controlled components はより多くの制御を提供しリアルタイムバリデーションを容易にしますが、uncontrolled components は複雑なバリデーションのない基本的なフォームにはよりシンプルです。
同じフォーム内で複数の controlled input をどのように管理しますか?
React で controlled checkbox を作成するにはどうしますか?
+17 面接問題