import "bootstrap/dist/css/bootstrap.min.css"; import Navbar from './components/Navbar'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import Home from './components/Home'; import Projects from './components/Projects'; import About from './components/About'; function App() { return( <> <Router> <Navbar /> <Home /> <Projects /> <About/> </Router> </> ); } export default App;Este es el código en './Proyectos':
import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; function Projects() { return ( <h1>Proj</h1> ); } export default Projects; Cuando hago clic en el enlace de la página Proyectos, el enlace no muestra el contenido en la función Projects() . Por favor ayuda.
Intente envolver cada componente en un componente <Route> . Algo como esto:
<Router> <Route path="/route/to/projects"> <Projects/> </Route> </Router>Hay algunas formas diferentes de hacer esto con React Router. Si no te gusta la forma en que lo hice, puedes encontrar más opciones aquí: React Router Routes