Windows

The v-window component is the baseline functionality for transitioning content from 1 pane to another. Other components such as v-tabs, v-carousel and v-stepper utilize this component at their core.

Usage

Designed to easily cycle through content, v-window provides a simple interface to create truly custom implementations.


API

v-window
Name
active-class
Default
'v-item--active'
Type
string
Name
dark
Default
false
Type
boolean

Applies the dark theme variant

Name
light
Default
false
Type
boolean

Applies the light theme variant

Name
mandatory
Default
true
Type
boolean
Name
max
Default
undefined
Type
number | string

Sets maximum width

Name
multiple
Default
false
Type
boolean
Name
reverse
Default
false
Type
boolean
Name
touch
Default
undefined
Type
object
Name
touchless
Default
false
Type
boolean
Name
value
Default
undefined
Type
any

Controls visibility

Name
vertical
Default
false
Type
boolean

Examples

Onboarding

v-window makes it easy to create custom components such as a different styled stepper.


Account creation

Create rich forms with smooth animations. v-window automatically tracks the current selection index to automatically change the transition direction. This can be manually controlled with the reverse prop.