React Hook Form の基礎知識

React Hook Formとは

hooksの仕組みを利用したライブラリであり、公式ドキュメントには「高性能で柔軟かつ拡張可能な使いやすいフォームバリデーションライブラリ」と掲げられている。

react-hook-formを使用することでuseStateを使用せずにフォームのバリデートやリセットなどを簡単に実装することができる

導入方法

npm install react-hook-form 

各関数についての説明

-useForm

React Hook Formライブラリ内で提供されているカスタムフックであり、ここからフォームの状態管理やバリデーションルールなどを設定することができる。

-register

バリデーションルールを追加することができる。

他にもreset()などの関数も備わっている

<input
  {...register("firstName", {
    required: true,
  })}
/>;

参考資料