Así que revisé varias publicaciones y sitios web y no puedo hacer que funcione. Simplemente muestra una pantalla blanca con la barra de navegación. Este es el código:
Aplicación.js:
import {BrowserRouter as Router, Routes, Route} from 'react-router-dom' function App() { return ( <Router> <Nav/> <Routes> <Route path='/about' element={About}/> </Routes> </Router> ); } export default App;Índice.js:
ReactDOM.render(<React.StrictMode><App/></React.StrictMode>, document.getElementById('root'))Algún componente:
<Link to="/about" className="btn btn-colored">Launch</Link>El componente 'Acerca de' funciona porque lo probé e importé a App.js, por lo que ese no es el problema.
Primero debe importar el componente que desea renderizar
Por ejemplo, desea representar el componente Acerca de, por lo que importaría el componente Acerca de
Importar el componente
importar Acerca de desde "./pages/About";
Arregle la sintaxis como en react-jsx lo escribimos entre corchetes </>.
<Ruta ruta='/acerca de' elemento={} />