Vue EasyUI 分类
分类（ Accordion ）允许您提供多个面板（ Panel ），并同时显示若干个面板（ Panel ）。提供的每个面板（ Panel ）都有展开和折叠的内建支持。
用户可自定义被选中的面板（ Panel ）。若未指定，则默认选中第一个面板（ Panel ）。
属性列表
| 名称 |
数据类型 |
作用描述 |
默认值 |
| border |
boolean |
是否显示边框。 |
true |
| multiple |
boolean |
为True时展开多个面板。 |
false |
| animte |
boolean |
定义展开或折叠面板时是否显示动画效果。 |
false |
| selectedIndex |
number, array |
已初始化的选中面板索引。 |
0 |
事件列表
| 名称 |
参数 |
作用描述 |
| panelSelect |
panel |
选中面板时触发。 |
| panelUnselect |
panel |
未选中面板时触发。 |
方法列表
| 名称 |
参数 |
返回值 |
作用描述 |
| select |
index |
void |
选择指定的面板。 |
| unselect |
index |
void |
取消选择指定的面板。 |
| getPanel |
index |
AccordionPanel |
获得指定面板。 |
| getPanelIndex |
panel |
number |
获得指定面板索引。 |
| getSelectedIndex |
none |
number |
获取第一个选中面板的索引。 |
| getSelectedPanel |
none |
AccordionPanel |
获取第一个选中的面板。 |
| getSelectedPanels |
none |
AccordionPanel[] |
获取所有选中的面板。 |
注：
- 继承： None 。
使用方法
<Accordion style="height:250px">
<AccordionPanel :title="'Title1'">
<p>Hello user.</p>
</AccordionPanel>
<AccordionPanel :title="'Title2'">
<p>Welcome to W3Cschool.</p>
</AccordionPanel>
<AccordionPanel :title="'Title3'">
<p>You'll learn something.</p>
</AccordionPanel>
</Accordion>
分类面板（ AccordionPanel ）
- 分类面板（ AccordionPanel ）选项继承自面板（ Panel ），以下是附加属性：
| 名称 |
数据类型 |
作用描述 |
默认值 |
| selected |
boolean |
是否选择面板。 |
false |
| 名称 |
参数 |
返回值 |
作用描述 |
| select |
none |
void |
选择面板。 |
| unselect |
none |
void |
取消选择面板。 |