Keeping state beetween tabs during navigation

@Gsouillard wrote:

Hello guys,
I have started my new Ionic React App.

However, I encounter small problems with navigation.
Indeed, my application uses Tabs navigation, but when I change tabs, the state is not save.

For example, if I load a list of 100 items on my Tab1, and then switch to Tab2, I should reload the list when I return to Tab1.

I did not have this problem on Angular.

Is there a way to keep the state between 2 tabs?

My render part of App.tsx :

 <IonApp>
     <IonReactRouter>
       <IonTabs>
         <IonRouterOutlet>
           <Route path="/tab1" component={Tab1} exact={true} />
           <Route path="/tab2" component={Tab2} exact={true} />
           <Route path="/tab3" component={Tab3} />
           <Route path="/detail/:symbol/:hash/:uuid" component={Detail} />
           <Route path="/" render={() => <Redirect to="/tab1" />} exact={true} />
         </IonRouterOutlet>
         <IonTabBar slot="bottom" mode="md">
           <IonTabButton tab="tab1" href="/tab1">
             <IonIcon icon={logo} />
             <IonLabel>Tab 1</IonLabel>
           </IonTabButton>
           <IonTabButton tab="Tab2" href="/tab2">
             <IonIcon icon={cashOutline} />
             <IonLabel>Tab2</IonLabel>
           </IonTabButton>
           <IonTabButton tab="tab3" href="/tab3">
             <IonIcon icon={logo} />
             <IonLabel>Tab3</IonLabel>
           </IonTabButton>
         </IonTabBar>
       </IonTabs>
     </IonReactRouter>
   </IonApp>

Thank you in advance !

Posts: 1

Participants: 1

Read full topic