React-router: ne démontez jamais un composant sur une route une fois monté, même si la route change
J'ai une application React qui déclare certaines routes:
<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 est un composant stupide qui vérifie la session, et appelez <Route component={component} /> ou <Redirect to={to} />, mais enfin, la méthode component est invoquée)
Où, fondamentalement, chaque composant est monté/démonté lors du changement de route. Je voudrais garder cet aspect sauf pour la route Dashboard qui fait beaucoup de choses, et que je voudrais être démonté une fois pas sur le tableau de bord (disons que vous arrivez sur une page de réunion, vous n'avez pas encore besoin de monter votre tableau de bord) mais une fois que vous avez chargé une fois votre tableau de bord, lorsque vous allez sur votre page de profil, une réunion ou autre chose, quand vous revenez sur votre tableau de bord, le composant n'a plus besoin d'être monté.
J'ai lu sur le document React-router que render ou les enfants pourraient être la solution, au lieu du composant, mais pourrions-nous mélanger des routes avec des enfants et d'autres avec un composant? J'ai essayé beaucoup de choses et je n'ai jamais atteint ce que je voulais, même avec render ou children, mon composant Dashboard est toujours en cours de montage/démontage.
Merci de votre aide
Le composant Switch ne rend qu'un seul itinéraire, la première correspondance l'emporte. Comme le composant Dashboard est à l'intérieur, il est démonté chaque fois qu'une autre route est mise en correspondance. Déplacez ce Route à l'extérieur et cela fonctionnera comme prévu avec render ou children.