# Tabbed component

**URL:** <https://forum.ionicframework.com/t/tabbed-component/212495>\
**Category:** Ionic React\
**Created:** [July 14, 2021, 4:08pm UTC](https://forum.ionicframework.com/t/tabbed-component/212495 "2021-07-14T16:08:06Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![faaa](https://avatars.discourse-cdn.com/v4/letter/f/b19c9b/32.png) [@faaa](https://forum.ionicframework.com/u/faaa)\
**Post date:** [July 14, 2021, 4:08pm UTC](https://forum.ionicframework.com/t/tabbed-component/212495/1 "2021-07-14T16:08:06Z")

</div>

Hello,

I would like to use tabs within one component, without navigating between different pages.  
I would like something like [Tabs in React-Bootstrap](https://react-bootstrap.github.io/components/tabs/) and [Tabs in React Material UI](https://material-ui.com/es/components/tabs/).  
However, as far as I have seen [IonTabs require IonRouterOutlet](https://github.com/ionic-team/ionic-framework/issues/19790) and therefore, tabs are navigated to a different page.

Is it possible to create a tabbed component using Ionic?

---

<div class="post-metadata">

**Author:** ![ptmkenny](https://avatars.discourse-cdn.com/v4/letter/p/ea666f/32.png) [@ptmkenny](https://forum.ionicframework.com/u/ptmkenny)\
**Post date:** [July 24, 2021, 4:04pm UTC](https://forum.ionicframework.com/t/tabbed-component/212495/2 "2021-07-24T16:04:57Z")

</div>

You’re probably looking for [ion-segment](https://ionicframework.com/docs/api/segment):

> Segments display a group of related buttons, sometimes known as segmented controls, in a horizontal row. They can be displayed inside of a toolbar or the main content.
> 
> Their functionality is similar to tabs, where selecting one will deselect all others. Segments are useful for toggling between different views inside of the content. Tabs should be used instead of a segment when clicking on a control should navigate between pages.
