0
219
VistasEl diseño no es un componente de <Ruta>. Todos los componentes secundarios de <Routes> deben ser <Route> o <React.Fragment>. ¿Cómo debo superar este error?
<Routes> <Route exact path='/'> <Layout> <Home></Home> </Layout> </Route> </Routes> El diseño consta de encabezado y pie de página, quiero envolver mi casa dentro de Diseño.
reaccionar 18.1.0
reaccionar-router-dom 6.0.2
·
Juan Pablo Isaza
2 Respuestas
Responde la pregunta0
Otros componentes Route son los únicos hijos válidos de un componente de Route . Este es el caso de uso de la construcción de rutas anidadas. Para contenido/componentes enrutados, estos deben usar el element prop.
Renderice el componente Layout como el element del componente Route .
Ejemplo:
<Routes> <Route path='/' element={( <Layout> <Home /> </Layout> )} /> </Routes> También es común que los componentes de diseño representen un Outlet para rutas anidadas.
Ejemplo:
const Layout = () => ( <> <Header /> <Outlet /> <Footer /> </> );...
<Routes> <Route element={<Layout />}> <Route path='/' element={<Home />} /> </Route> </Routes>
·
Juan Pablo Isaza
Denunciar
0
Simplemente puede extraer el componente <Home/> desde allí y proporcionar el diseño como un accesorio para la ruta como este
<Route component={Layout} />Y proporcione su componente de inicio dentro del componente de Diseño en sí mismo
·
Juan Pablo Isaza
Denunciar
Responde la pregunta