Soy un principiante con React y trato de hacer algo de enrutamiento.
Estoy tratando de implementar Route en React para redirigir a otra página, pero cada vez que inserto, muestra el error: Llamada de gancho no válida.
Aquí está el código de App.js
import React from 'react'; import './App.css'; import Nav from './Nav'; import EKGSim from './EKGSim'; import { BrowserRouter as Router, Routes, Route} from 'react-router-dom'; function App() { return( <Router> <div className='App'> <Nav /> <Routes> <Route path="/ekgsim" element={<EKGSim/>} /> </Routes> </div> </Router> ) } export default App;¿Alguien puede decirme dónde está el problema? Estuve horas intentando encontrar la solución pero no encontré nada. ¡Cualquier ayuda será apreciada! Gracias
Código para el Nav.js
import React from 'react'; import './App.css'; function Nav(){ return( <nav> <h3>Home</h3> <ul className='nav-links'> <li>Was Ist EKG?</li> <li>EKG Component</li> <li>EKG Simulator</li> </ul> </nav> ); } export default Nav;y el EKGSim.js
import React from 'react'; import './App.css'; function EKGSim(){ return( <div> <h1>EKG Simulator </h1> </div> ); } export default EKGSim;Necesitas usar Route dentro de Routes prueba esto
function App() { return ( <Router> <div className="App"> <Routes> <Route path="/ekgsim" element={<EKGSim/>} /> </Routes> </div> </Router> ); }¡Problema resuelto!
¡Acabo de ejecutar este comando npm install --save react-router-dom y funciona perfectamente!
Creo que el problema era que no había react-router-dom en mi paquete.json.
¡Gracias por la respuesta de todos!