Skip to main content
Version: v8

ion-tab

shadow

The tab component is a child component of tabs. Each tab can contain a top level navigation stack for an app or a single view. An app can have many tabs, all with their own independent navigation.

note

Angular, React, and Vue can only use this component when the ion-tabs component is configured for basic usage. When setting up tabs with routing, the ion-tab component cannot be used.

In JavaScript, this component can be used with the ion-tabs component configured for either basic usage or usage with router.

See the tabs documentation for more details on configuring tabs.

Properties​

component​

DescriptionThe component to display inside of the tab.
Attributecomponent
TypeFunction īŊœ HTMLElement īŊœ null īŊœ string īŊœ undefined
Defaultundefined

tab​

DescriptionA tab id must be provided for each ion-tab. It's used internally to reference the selected tab or by the router to switch between them.
Attributetab
Typestring
Defaultundefined

Events​

No events available for this component.

Methods​

setActive​

DescriptionSet the active component for the tab
SignaturesetActive() => Promise<void>

CSS Shadow Parts​

No CSS shadow parts available for this component.

CSS Custom Properties​

No CSS custom properties available for this component.

Slots​

No slots available for this component.