Tabs

The Tabs component allows you to create a tabbed UI to navigate between pages or views. You can create tab items in the items array, or populate tab items from a dataSource.

Configure Overflow Behavior

The Tabs component stretches to fit its container if you do not specify the component's width. When the total tab width exceeds the component’s width, navigation buttons appear. A user can click these buttons to scroll through the tabs. Use the showNavButtons and scrollByContent properties to control this behavior.

Customize Tab Contents and Appearance

You can initialize a tab’s contents (text, icons and badges) with values from underlying data objects. This example demonstrates this technique. You can also specify an item template (itemTemplate) to customize tabs.

Process Tab Selection

Specify the selectedIndex property to select a specific tab. Use the onItemClick function to process clicks on tabs.