45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { IonIcon, IonLabel, IonTabBar, IonTabButton, IonTabs, IonRouterOutlet } from '@ionic/react';
|
|
import { Redirect, Route } from 'react-router-dom';
|
|
|
|
import { Home, Bag, Heart2, Notification } from 'react-iconly';
|
|
import Homepage from '../pages/Home';
|
|
import Favourites from '../pages/Favourites';
|
|
import Cart from '../pages/Cart';
|
|
|
|
const Tabs = (props) => {
|
|
return (
|
|
<IonTabs>
|
|
<IonRouterOutlet>
|
|
<Route
|
|
exact
|
|
path="/demo-ordering-app/tabs/home"
|
|
render={(props) => <Homepage {...props} />}
|
|
/>
|
|
<Route exact path="/demo-ordering-app/tabs/cart" render={(props) => <Cart {...props} />} />
|
|
<Route
|
|
exact
|
|
path="/demo-ordering-app/tabs/favourites"
|
|
render={(props) => <Favourites {...props} />}
|
|
/>
|
|
</IonRouterOutlet>
|
|
|
|
<IonTabBar slot="bottom">
|
|
<IonTabButton tab="tab1" href="/demo-ordering-app/tabs/home">
|
|
<Home set="bold" />
|
|
</IonTabButton>
|
|
|
|
<IonTabButton tab="tab2" href="/demo-ordering-app/tabs/cart">
|
|
<Bag set="bold" />
|
|
</IonTabButton>
|
|
|
|
<IonTabButton tab="tab3" href="/demo-ordering-app/tabs/favourites">
|
|
<Heart2 set="bold" />
|
|
</IonTabButton>
|
|
</IonTabBar>
|
|
</IonTabs>
|
|
);
|
|
};
|
|
|
|
export default Tabs;
|