Collapse

Use Collapse to store contents.

Basic usage

You can expand multiple panels

Accordion

In accordion mode, only one panel can be expanded at once

Custom title

Besides using the title attribute, you can customize panel title with named slots, which makes adding custom content, e.g. icons, possible.

Collapse Attributes

AttributeDescriptionTypeAccepted ValuesDefault
model-value / v-modelcurrently active panelstring (accordion mode) / array (non-accordion mode)
accordionwhether to activate accordion modebooleanfalse

Collapse Events

Event NameDescriptionParameters
changetriggers when active panels change(activeNames: array (non-accordion mode) / string (accordion mode))

Collapse Slots

NameDescriptionSubtags
-customize default contentCollapse Item

Collapse Item Attributes

AttributeDescriptionTypeAccepted ValuesDefault
nameunique identification of the panelstring/number
titletitle of the panelstring
disableddisable the collapse itemboolean

Collapse Item Slot

NameDescription
content of Collapse Item
titlecontent of Collapse Item title

Source

ComponentDocs

Contributors