Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

236
Vistas
Llamada de enlace no válida, next.js/react

He seguido este tutorial para hacer un menú de hamburguesas en react/next.js: https://youtu.be/prbOI7G0RvY

 import { useState } from "react"; import user from '../styles/userview.module.css' export function PageHeader() { const [isOpen, setIsOpen] = useState(false); const openMenu= ()=> setIsOpen(!isOpen); return ( <header className={user.header}> <nav className={user.navbar}> <a className={user.navlogo}>[BrandLogo]</a> <ul className={isOpen === false ? user.navmenu : user.navmenu + ' ' + user.active}> <li className={user.navitem}> <a className={user.navlink}>Home</a> </li> <li className={user.navitem}> <a className={user.navlink}>About</a> </li> <li className={user.navitem}> <a className={user.navlink}>Contact</a> </li> </ul> <button className={isOpen === false ? user.hamburger : user.hamburger + ' ' + user.active} onClick= {openMenu} > <span className={user.bar}></span> <span className={user.bar}></span> <span className={user.bar}></span> </button> </nav> </header> ) }

Pero sigo recibiendo este mensaje de error:

Error: llamada de gancho no válida. Los ganchos solo se pueden llamar dentro del cuerpo de un componente de función. Esto podría suceder por una de las siguientes razones:

  1. Es posible que tenga versiones que no coincidan de React y el renderizador (como React DOM)
  2. Podrías estar rompiendo las Reglas de los Hooks
  3. Es posible que tenga más de una copia de React en la misma aplicación Consulte https://reactjs.org/link/invalid-hook-call para obtener consejos sobre cómo depurar y solucionar este problema.

También indica que el problema está en esta fila: const [isOpen, setIsOpen] = useState(false);

¿Puede alguien por favor ayudarme a entender lo que está mal?

EDITAR: aquí hay una imagen del mensaje de error exacto: https://pasteboard.co/3xyAu6m8IeAW.png

EDICIÓN 2: abrí mi repositorio para que puedas verlo/probarlo por tu cuenta. ¿Quizás la falla está en otro archivo? El menú de hamburguesas está en la rama principal y ..components/userview y la página que importa y muestra el menú de hamburguesas es ../pages/hamburgertestfile.

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

La respuesta fue proporcionada por un usuario de Next.js-github-forum:

https://github.com/vercel/next.js/discusiones/34858

about 4 years ago · Juan Pablo Isaza Denunciar

0

No puede llamar ganchos desde una función javascript regular como se especifica en los documentos , por lo tanto, intente importar React en su primera línea para convertir la función javascript en una función React

 import React, { useState } from "react";
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda