React EasyUI 分类
分类( Accordion )允许您提供多个面板( Panel ),并同时显示若干个面板( Panel )。提供的每个面板( Panel )都有展开和折叠的内建支持。
用户可自定义被选中的面板( Panel )。若未指定,则默认选中第一个面板( Panel )。
属性列表
| 名称 |
数据类型 |
作用描述 |
默认值 |
| border |
boolean |
是否显示边框。 |
true |
| multiple |
boolean |
为True时展开多个面板。 |
false |
| animte |
boolean |
定义展开或折叠面板时是否显示动画效果。 |
false |
| selectedIndex |
number, array |
已初始化的选中面板索引。 |
0 |
事件列表
| 名称 |
参数 |
作用描述 |
| onPanelSelect |
panel |
选中面板时触发。 |
| onPanelUnselect |
panel |
未选中面板时触发。 |
注:
- 继承: LocaleBase 。
使用方法
<Accordion style={{ height: 250 }}>
<AccordionPanel title="Title1">
<p>Content1</p>
</AccordionPanel>
<AccordionPanel title="Title2">
<p>Content2</p>
</AccordionPanel>
<AccordionPanel title="Title3">
<p>Content3</p>
</AccordionPanel>
</Accordion>
分类面板( AccordionPanel )
- 分类面板( AccordionPanel )选项继承自面板( Panel )。
| 名称 |
数据类型 |
作用描述 |
默认值 |
| title |
string |
面板标题。 |
|
| collapsible |
boolean |
是否在标题上显示可折叠按钮。 |
true |
| collapsed |
boolean |
面板是否已经折叠。 |
true |
| selected |
boolean |
是否选择面板。 |
false |
| expandIconCls |
string |
展开图标类。 |
accordion-expand |
| collapseIconCls |
string |
正在折叠的图标类。 |
accordion-collapse |