Fix for dynamic routes with app router SSR
This commit is contained in:
+20
-10
@@ -1,6 +1,12 @@
|
||||
import { Redirect, Route } from 'react-router-dom';
|
||||
import { IonRouterOutlet, IonTabs, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/react';
|
||||
import { IonReactRouter } from '@ionic/react-router';
|
||||
import {
|
||||
IonRouterOutlet,
|
||||
IonTabs,
|
||||
IonTabBar,
|
||||
IonTabButton,
|
||||
IonIcon,
|
||||
IonLabel,
|
||||
} from '@ionic/react';
|
||||
import { cog, flash, list } from 'ionicons/icons';
|
||||
|
||||
import Home from './Feed';
|
||||
@@ -12,22 +18,26 @@ const Tabs = () => {
|
||||
return (
|
||||
<IonTabs>
|
||||
<IonRouterOutlet>
|
||||
<Route path="/tabs/feed" render={() => <Home />} exact={true} />
|
||||
<Route path="/tabs/lists" render={() => <Lists />} exact={true} />
|
||||
<Route path="/tabs/lists/:listId" render={() => <ListDetail />} exact={true} />
|
||||
<Route path="/tabs/settings" render={() => <Settings />} exact={true} />
|
||||
<Route path="/tabs" render={() => <Redirect to="/tabs/feed" />} exact={true} />
|
||||
<Route path="/feed" render={() => <Home />} exact={true} />
|
||||
<Route path="/lists" render={() => <Lists />} exact={true} />
|
||||
<Route
|
||||
path="/lists/:listId"
|
||||
render={() => <ListDetail />}
|
||||
exact={true}
|
||||
/>
|
||||
<Route path="/settings" render={() => <Settings />} exact={true} />
|
||||
<Route path="" render={() => <Redirect to="/feed" />} exact={true} />
|
||||
</IonRouterOutlet>
|
||||
<IonTabBar slot="bottom">
|
||||
<IonTabButton tab="tab1" href="/tabs/feed">
|
||||
<IonTabButton tab="tab1" href="/feed">
|
||||
<IonIcon icon={flash} />
|
||||
<IonLabel>Feed</IonLabel>
|
||||
</IonTabButton>
|
||||
<IonTabButton tab="tab2" href="/tabs/lists">
|
||||
<IonTabButton tab="tab2" href="/lists">
|
||||
<IonIcon icon={list} />
|
||||
<IonLabel>Lists</IonLabel>
|
||||
</IonTabButton>
|
||||
<IonTabButton tab="tab3" href="/tabs/settings">
|
||||
<IonTabButton tab="tab3" href="/settings">
|
||||
<IonIcon icon={cog} />
|
||||
<IonLabel>Settings</IonLabel>
|
||||
</IonTabButton>
|
||||
|
||||
Reference in New Issue
Block a user