Collapse
I saw it appears in many side control panels.
Demos
basic
arrow-placement
accordion
nested
display-directive
item-header-click
Props
Collapse Props
Name
Type
Default
Description
accordion
boolean
false
arrow-placement
'left' | 'right'
'left'
display-directive
'if' | 'show'
'if'
The display directive to use when its inner n-collapse-item
render content. 'if'
corresponds to v-if
and 'show'
corresponds to v-show
.
expanded-names
Array<string | number>
undefined
theme
'light' | 'dark' | string
undefined
on-update-expanded-names
(expandedNames: Array<string>) => any
undefined
on-item-header-click
(data: { name: string, expanded: boolean, event: MouseEvent }) => any
undefined
Collapse Item Props
Name
Type
Default
Description
display-directive
'if' | 'show'
undefined
The display directive to use when it is rendering its content. 'if'
corresponds to v-if
and 'show'
corresponds to v-show
. When it is set to undefined
the value will follow its outer n-collapse
.
name
string | number
required
title
string
undefined
Slots
Collapse Slots
Name
Parameters
Description
default
()
Collapse Item Slots
Name
Parameters
Description
default
()
header
()
arrow
(options: { collapsed: boolean })