React-router: nunca desmonte un componente en una ruta una vez montado, incluso si el cambio de ruta
Tengo una aplicación React que declara algunas rutas:
<Switch>
<Route exact path={'/'} render={this.renderRootRoute} />
<Route exact path={'/lostpassword'} component={LostPassword} />
<AuthenticatedRoute exact path={'/profile'} component={Profile} session={session} redirect={'/'} />
<AuthenticatedRoute path={'/dashboard'} component={Dashboard} session={session} redirect={'/'} />
<AuthenticatedRoute path={'/meeting/:meetingId'} component={MeetingContainer} session={session} redirect={'/'} />
<Route component={NotFound} />
</Switch>
(AuthenticatedRoute
es un componente tonto que verifica la sesión y llama<Route component={component} />
o<Redirect to={to} />
pero al fincomponent
se invoca el método)
Donde básicamente cada componente se monta / desmonta en el cambio de ruta. Me gustaría mantener ese aspectoexcepto Para elDashboard
ruta que hace muchas cosas, y que me gustaría desmontar una vez que no esté en el tablero (digamos que llegas a una página de reunión, no necesitas montar tu tablero todavía) pero una vez que cargaste una vez tu Tablero, cuando vaya a su página de perfil, a una reunión o lo que sea, cuando regrese a su Tablero, el componente no tiene que volver a montarse.
Leí en React-router doc quehacer o los niños podrían ser la solución, en lugar de componentes, pero ¿podríamos mezclar rutas con niños y otras con componentes? Intenté muchas cosas y nunca logré lo que quería, incluso conrender
ochildren
, mi componente del Tablero sigue montando / desmontando.
Gracias por tu ayuda