【React-hook-form】バリデーションフォームについて詳しく調べてみた

import { useForm } from 'react-hook-form'
......
const Form = () => {
  const { register, handleSubmit, errors, reset, setValue } = useForm()
......

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input
        type="text"
        placeholder="First name"
        name="First name"
        ref={register({required: true, maxLength: 80})}
      />
      <input
        type="text"
        placeholder="Last name"
        name="Last name"
        ref={register({required: true, maxLength: 100})}
      />
      <input
        type="text"
        placeholder="Email"
        name="Email"
        ref={register({required: true, pattern: /^\S+@\S+$/i})}
      />
      <input
        type="tel"
        placeholder="Mobile number"
        name="Mobile number"
        ref={register({required: true, minLength: 6, maxLength: 12})}
      />