Accordion #
Allows you to control group of collapses.
Examples #
Default #
Default usage of the va-accordion component.
Multiple #
Accordion component allows you to select multiple collapses.
Menu #
One of the interesting ways to use the component is a collapsing menu.
See example with VaSidebarItem
Accessibility #
Expand/collapse of accordion item in focus is dependent on multiple prop, for other accessability information see VaCollapse accessibility section.
API #
Props #
| Name | Description | Types | Default |
|---|---|---|---|
| inset | Collapse becomes smaller when activated |
|
|
| modelValue | The value of the |
|
|
| multiple | Allows to expand multiple components |
|
|
| popout | Collapse becomes bigger when activated |
|
|
| preset | Named preset combination of component props. |
| - |
| stateful | Add possibility to work with component without setting |
|
|
Events #
| Name | Description |
|---|---|
update:modelValue | The event is triggered when the component needs to change the model. Is also used by |
Slots #
| Name | Description |
|---|---|
default | Contains collapses |