En mi aplicación Remix, intento mostrar de forma condicional un widget de interfaz de usuario, según el valor de una variable de estado. Aquí está mi código.
import { useState } from "react"; import type { LinksFunction } from "remix"; import stylesUrl from "../styles/index.css"; export const links: LinksFunction = () => { return [ { rel: "stylesheet", href: stylesUrl } ]; }; export default function Index() { const [isMenuOpen,setMenuOpen] = useState(false) function toggleNav(){ window.alert("hh") // no alert is shown console.log("hi") // no console statement is printed setMenuOpen(!isMenuOpen) } return ( <div className="landing"> <button onClick={toggleNav}>test</button> </div> ); } Sin embargo, la función toggleNav no parece activarse al hacer clic en el botón. No pude ver ninguna alerta o salida en la consola.
No podía entender por qué no funciona. Sería genial, si alguien me puede señalar lo que estoy haciendo mal aquí. TIA.
Asegúrese de que está procesando el componente Scripts de Remix en la ruta raíz; sin él, su aplicación no cargará ningún lado del cliente JS.
Ver https://remix.run/docs/en/v1/api/remix#meta-links-scripts