Tengo un enlace personalizado para obtener datos de la API. Invocar el enlace personalizado fuera de handleSubmit funciona, pero dentro de handleSubmit no funciona.

 const Login = () => { const userRef = useRef(); const [user, setUser] = useState(""); const isUser = useLoginHook(user); **//// This works** const handleSubmit = async (e) => { e.preventDefault(); const isUser = useLoginHook(user); **///// This does not work** }; return ( <> <main className="App"> <form onSubmit={handleSubmit}> <input type="text" id="username" ref={userRef} autoComplete="off" onChange={(e) => setUser(e.target.value)} value={user} required aria-invalid={validName ? "false" : "true"} aria-describedby="uidnote" onFocus={() => setUserFocus(true)} onBlur={() => setUserFocus(false)} /> </form> </main> </> ); };

Recibo el error "Se llama al gancho React en una función que no es ni una función React ni una función React Hook personalizada"