Utilizing React Hook Forms

Use react-hook-form for tracking the data, implementing validation for the data inputs. You can learn more about react-hook-form in their documentation (https://react-hook-form.com/). Given below is an example for how the forms are supposed to be used.

import React from "react";
import { useForm, SubmitHandler } from "react-hook-form";

type FormValues = {
    firstName: string;
    lastName: string;
    email: string;
};

export default function App() {
    const { register, handleSubmit, reset } = useForm<FormValues>();
    const onSubmit: SubmitHandler<FormValues> = (data) => console.log(data);

    return (
        <form onSubmit={handleSubmit(onSubmit)}>
            <input {...register("firstName")} />
            <input {...register("lastName")} />
            <input type="email" {...register("email")} />

            <input type="submit" />
        </form>
    );
}

Last updated