React / Next.js

フォームと Controlled Components

Controlled components、uncontrolled components、フォームバリデーション、React Hook Form、submit の処理

20 面接問題·
Mid-Level
1

React における controlled component とは何ですか?

回答

Controlled component とは、value prop と onChange ハンドラーを通じて React の state によって値が管理されるフォーム要素です。つまり、React がそのデータの信頼できる唯一の情報源となります。DOM が独自の値を保持する uncontrolled components とは異なり、controlled components はフォームデータを完全に制御でき、リアルタイムバリデーションを容易にします。

2

React で controlled input を作成するにはどうしますか?

回答

Controlled input には2つの必須要素が必要です:React の state にバインドされた value prop と、その state を更新する onChange ハンドラーです。onChange がなければ、React が変更を防止するため input は読み取り専用になります。このアプローチにより、React の state は表示されている input の値と常に同期され、即時バリデーションやデータ変換が可能になります。

3

Controlled component と uncontrolled component の違いは何ですか?

回答

根本的な違いはデータの信頼できる情報源にあります。Controlled component は値を React の state(信頼できる唯一の情報源)に格納しますが、uncontrolled component は DOM に独自の値を管理させ、ref を通じてアクセスします。Controlled components はより多くの制御を提供しリアルタイムバリデーションを容易にしますが、uncontrolled components は複雑なバリデーションのない基本的なフォームにはよりシンプルです。

4

同じフォーム内で複数の controlled input をどのように管理しますか?

5

React で controlled checkbox を作成するにはどうしますか?

+17 面接問題

次の面接に向けてReact / Next.jsをマスター

すべての問題、flashcards、技術テスト、コードレビュー演習、面接シミュレーターにアクセス。

無料で始める