Obtengo una página en blanco cuando uso Link. Debería ver Eventos, fecha, accueil. Uso la última versión de react-router. No sé si tengo que eliminar a?
Este es mi código:
import logo from './logo.svg'; import './App.css'; import React, { Component } from 'react' // import Header from './components/Header'; import Events from './components/Events/Events'; import { BrowserRouter, Route, Routes, Link } from 'react-router-dom'; function App() { return ( <div className="wrapper"> <h1>Marine Mammals</h1> <nav> <ul> <li><Link to="/events">Events</Link></li> <li><Link to="/date">Date</Link></li> <li><Link to="/accueil">Accueil</Link></li> </ul> </nav> <BrowserRouter> <Routes> <Route path='/Events' element={<Events/>}/> </Routes> </BrowserRouter> </div> ); } export default App;¡Gracias!
Parece probable que esté causando un error porque Link debe ser un descendiente del componente Router (BrowserRouter).
import logo from './logo.svg'; import './App.css'; import React, { Component } from 'react' import Events from './components/Events/Events'; import { BrowserRouter, Route, Routes, Link } from 'react-router-dom'; function App() { return ( <BrowserRouter> <div className="wrapper"> <h1>Marine Mammals</h1> <nav> <ul> <li><Link to="/events">Events</Link></li> <li><Link to="/date">Date</Link></li> <li><Link to="/accueil">Accueil</Link></li> </ul> </nav> <Routes> <Route path='/Events' element={<Events/>}/> </Routes> </div> </BrowserRouter> ); }