• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

121
Vistas
La ruta de hoja coincidente en la ubicación "/" no tiene un elemento

La ruta de hoja coincidente en la ubicación "/" no tiene ningún elemento. Esto significa que generará un valor nulo de forma predeterminada, lo que dará como resultado una página "vacía".

 //App.js File import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; import Home from './pages/Home'; // import ReactDOM from "react-dom"; const App = () => { return ( <Router > <Routes> <Route path="/" component={ Home }></Route> </Routes> </Router> ) } export default App;

** Mi código relacionado con el enrutador de reacción no funciona. No sé por qué sucedió cuando empiezo a insertar alguna ruta en el programa para que muestre este error **

over 3 years ago · Santiago Trujillo
7 Respuestas
Responde la pregunta

0

Yo tuve el mismo problema. Reemplace el componente con el elemento y funcionó.

Reemplace esto:

 <Route path="/" component={HomePage} exact />

con este:

 <Route path="/" element={<HomePage/>} exact />
over 3 years ago · Santiago Trujillo Denunciar

0

Muy simple:

  1. usar elemento en lugar de componente
  2. envuelva su componente de esta manera: {} en lugar de {Home}

<Ruta path="/" componente={ }>

over 3 years ago · Santiago Trujillo Denunciar

0

En V6, ya no puede usar el accesorio de componente . Debe ser reemplazado por elemento

 import './App.css'; import { BrowserRouter as Router, Route, Routes } from "react-router-dom"; import Home from './pages/Home'; function App() { return <div className="App"> <Router> <Routes> <Route path="/" element={<Home />}></Route> </Routes> </Router> </div>; } export default App;
over 3 years ago · Santiago Trujillo Denunciar

0

en la versión 6:

componente reemplazado con element y necesita cerrar "</Route>"

 <Route exact path="/" element={<AddTutorial />}></Route>

https://reactrouter.com/docs/en/v6/getting-started/overview

over 3 years ago · Santiago Trujillo Denunciar

0

En primer lugar, verifique su versión de react-router-dom desde el archivo package.json . Si está por encima de la versión 6, debería hacerlo así.

 import './App.css'; import { BrowserRouter as Router, Route, Routes } from "react-router-dom"; import Home from './pages/Home'; function App() { return ( <div className="App"> <Router> <Routes> <Route path="/" element={<Home />}></Route> </Routes> </Router> </div> ); } export default App;
over 3 years ago · Santiago Trujillo Denunciar

0

Tuve el mismo error, sin embargo, mi solución fue ligeramente diferente. Había escrito mal el elemento.

 <Route exact path='/MyGames' elemtent={<MyGames/>}/>

y este fue el error que me dio en la consola del navegador

Matched leaf route at location "/MyGames" does not have an element. This means it will render an <Outlet /> with a null value by default resulting in an "empty" page.

over 3 years ago · Santiago Trujillo Denunciar

0

En V6, ya no puede usar el accesorio de component . Fue reemplazado a favor del element :

 <Route path="/" element={<Home />}></Route>

Más información en el documento de migración .

over 3 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda