Esta es mi app.js. Estoy tratando de obtener una vista previa del código, pero muestra una página en blanco como extremadamente en blanco, ni siquiera con un error mientras que en mi terminal dice compilado correctamente.
import TopBar from './components/topbar/TopBar'; import Home from './pages/home/home'; import Write from './pages/write'; import Single from './pages/single'; import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; function App() { return ( <> <Router> <TopBar/> <Routes> <Route exact path ="/" element = {Home} /> <Route path ="/write" element = {Write} /> <Route path ="/single" element = {Single} /> </Routes> </Router> </> ); } export default App;Con React Router Dom v6 , debe llamar al componente dado a la propiedad del element , así:
<Route exact path ="/" element = {<Home/>} /> <Route path ="/write" element = {<Write/>} /> <Route path ="/single" element = {<Single/>} />Consulte la consola de su navegador para ver más detalles.
pero hasta donde yo sé, en la versión 6 no hay exact en <Route/> props quítalo
intente eliminar exactamente y usar enrutadores secundarios, creo que eso ayudaría
function App() { return ( <> <Router> <TopBar /> <Routes> <Route path="/" element={Home}> <Route path="write" element={Write} /> <Route path="single" element={Single} /> </Route> </Routes> </Router> </> ); }