Skip to main content
Vuetify0 is now in alpha!
Vuetify0 Logo
Theme
Mode
Palettes
Accessibility
Vuetify One
Sign in to Vuetify One

Access premium tools across the Vuetify ecosystem — Bin, Play, Studio, and more.

Not a subscriber? See what's included

Tabs API

API reference for the Tabs components.

Explore these related pages for additional context and usage patterns.

PageCategory
TabsDisclosure
createStepSelection
Expansion PanelDisclosure
DialogDisclosure

Tabs.Root

Props

namespace

string | undefined

Namespace for dependency injection (must match child namespace)

Default: "v0:tabs"

disabled

boolean | undefined

Disables the entire tabs instance

Default: false

enroll

boolean | undefined

Auto-select non-disabled items on registration

Default: false

mandatory

boolean | "force" | undefined

Controls mandatory tab behavior: - false: No mandatory tab enforcement - true: Prevents deselecting the last selected item - `force` (default): Automatically selects the first non-disabled tab

Default: "force"

circular

boolean | undefined

Whether arrow key navigation wraps around

Default: true

orientation

TabsOrientation | undefined

Tab orientation for keyboard navigation

Default: "horizontal"

activation

any

Activation mode: - `automatic`: Tab activates on focus (arrow keys) - `manual`: Tab activates on Enter/Space only

Default: "automatic"

modelValue

T | T[] | undefined

Events

update:model-value

[value: T | T[]]

Slots

default

TabsRootSlotProps

Tabs.Item

Props

id

any

Unique identifier (auto-generated if not provided)

value

V | undefined

Value associated with this tab (used to match with TabsPanel)

disabled

MaybeRefOrGetter<boolean> | undefined

Disables this specific tab

namespace

string | undefined

Namespace for dependency injection

Default: "v0:tabs"

ariaLabel

string | undefined

Accessible label for this tab

ariaLabelledby

string | undefined

ID of element that labels this tab

ariaDescribedby

string | undefined

ID of element that describes this tab

Slots

default

TabsItemSlotProps

Tabs.List

Props

label

string | undefined

Accessible label for the tablist

namespace

string | undefined

Namespace for dependency injection

Default: "v0:tabs"

Slots

default

TabsListSlotProps

Tabs.Panel

Props

value required

V

Value to match with corresponding TabsItem

namespace

string | undefined

Namespace for dependency injection

Default: "v0:tabs"

Slots

default

TabsPanelSlotProps
Was this page helpful?

© 2016-1970 Vuetify, LLC
Ctrl+/