I am seeking guidance on how to dynamically disable a button based on the input values of both Name and State in the given code snippet. Specifically, I want to restrict button functionality until both name and state fields are filled out, regardless of whether the email field is empty or not.
import React from "react";
import { useForm, SubmitHandler } from "react-hook-form";
type FormValues = {
name: string;
state: string;
email: string;
};
export default function App() {
const { register, handleSubmit } = useForm<FormValues>();
const onSubmit: SubmitHandler<FormValues> = data => console.log(data);
return (
<form onSubmit={handleSubmit(onSubmit)}>
<input {...register("name")} />
<input {...register("state")} />
<input type="email" {...register("email")} />
<input type="submit" />
</form>
);
}