1

Me explico: tengo una estructura de rutas en ReactJS de la siguiente forma:

<BrowserRouter>
    <Layout header={ this.state.header } navbar={ this.state.navbar }>
        <Switch>
            <Route exact path="/" render={ () => <Dashboard items={ this.state.navbar.items } /> }/>
            <Route exact path="/panel" component={ Panel } />
        </Switch>
    </Layout>
</BrowserRouter>

Como se ve en el código cualquier ruta que agregue ejecutará el componente indicado y lo pintará utilizando el Layout ya definido. Mi pregunta es ¿Como puedo decirle a una de esas rutas que ignore el Layout? Es decir que no muestre nada del contenido del Layout.

Una solución que se me ocurrió fue indicar por cada Route el Layout a pintar pero no se si sea la manera correcta de hacerlo.

<BrowserRouter>
    <Switch>
        <Route exact path="/" render={ () => <Dashboard items={ this.state.navbar.items } /> } }/>

        <Route exact path="/panelcem" render={ () => {
            return(
                <Layout header={ this.state.header } navbar={ this.state.navbar }>
                    <PanelCem />
                </Layout>
            )
        } } />
    </Switch>
</BrowserRouter>

1 respuesta 1

0

Puedes intentar pasar una prop que diga al layout si renderiza o no.

<Layout hasToBeRendered={true} />

Otra opción es simplemente no pintar el componente, ¿estás obligado a pintarlo incluso si no necesitas mostrar nada?

2
  • El problema es que para pasar ese prop me toca indicar por cada Route el Layout, que es lo que ya estoy haciendo y no me parece óptimo. El componente si va a mostrar información solo no necesita lo que contiene el Layout Commented el 16 abr. 2020 a las 14:10
  • Mira a ver si esto que comentan aquí soluciona tu pregunta stackoverflow.com/questions/57572051/ignore-react-router-route
    – David
    Commented el 16 abr. 2020 a las 14:45

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.