Accordion折叠面板模块
Accordion模块可以创建一个可嵌套的折叠面板，支持多种数据格式
简单使用
对任意原生标签使用ax-accordion属性即可表示一个折叠面板。
因为折叠面板通常用来存放大段内容（真实DOM），所以最简单的用法便是直接将标题和主内容分别写入_accordion-head和_accordion-cont标签中，模块将不会对ax-accordion内部的html进行数据化。
-
-
中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
-
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。
-
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。
-
也可以通过id+new的方式创建实例。
-
-
中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
-
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。
-
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。
-
-
new ax.Accordion('#demo');
基础配置
| 属性名 |
类型 |
默认值 |
说明 |
| name |
string |
'' |
隐藏字段的name属性 |
| content |
any |
'' |
数据源 |
| contType |
'async'|'html'|'text'|'' |
'text' |
内容类型 |
| contData |
object |
{} |
请求content时发送的数据 |
| ajax |
object |
{} |
异步请求参数 |
| passive |
boolean |
false |
是否完全禁用 |
| disable |
string|number|DOM|object|array |
'' |
初始禁用项 |
| readonly |
string|number|DOM|object|array |
'' |
初始只读项 |
| deferred |
boolean |
false |
是否延迟渲染子节点 |
| delay |
number |
100 |
事件防抖延迟(ms) |
展开/折叠配置
| 属性名 |
类型 |
默认值 |
说明 |
| expand.value |
string|number|DOM|object|array |
'' |
初始展开项 |
| expand.all |
boolean |
false |
是否展开全部 |
| expand.only |
boolean |
true |
是否仅展开一项 |
| expand.linkage |
boolean |
false |
是否联动父层展开 |
| clickLine |
'checked'|'expanded'|'none' |
'none' |
点击分支行行为 |
交互配置
| 属性名 |
类型 |
默认值 |
说明 |
| arrow |
boolean |object |
{} |
配置指示箭头 |
| arrow.enable |
boolean |
true |
是否启用指示箭头 |
| arrow.show |
string |
'_icon-down' |
展开状态的类名 |
| arrow.hide |
string |
'_icon-down' |
折叠状态的类名 |
| arrow.anim |
string |
'_rotate180' |
动画类名 |
| arrow.type |
'icon'|'image' |
'icon' |
箭头类型 |
| arrow.trigger |
'click'|'hover' |
'click' |
触发展开的事件 |
| check |
boolean | object |
{} |
配置复选/单选 |
| check.enable |
boolean |
false |
是否启用复选/单选 |
| check.type |
'checkbox'|'radio'|'none' |
'checkbox' |
选择模式 |
| check.value |
string|number|DOM|object|array |
'' |
初始选中项 |
工具配置
| 属性名 |
类型 |
默认值 |
说明 |
| tools |
boolean |object |
{} |
配置编辑工具 |
| tools.enable |
boolean |
false |
是否显示编辑工具 |
| tools.trigger |
'click'|'hover'|'none' |
'hover' |
工具显示触发方式 |
| tools.children |
array |
['add', 'edit', 'remove'] |
工具按钮类型 |
外观配置
| 属性名 |
类型 |
默认值 |
说明 |
| lamp |
boolean |object |
{} |
配置指示灯 |
| lamp.enable |
boolean |
false |
是否启用标签指示灯 |
| lamp.placement |
'left'|'right'|'top'|'bottom' |
'bottom' |
指示灯位置 |
| duration |
number |
0 |
动画持续时间(ms) |
| classes |
string |
'' |
附加CSS类名 |
| layout |
string |
'check(icon|disk|cube|label|tips)custom|tools|badge|arrow' |
头部节点布局 |
| appear.rounded |
boolean |
true |
是否显示圆角 |
| appear.bordered |
boolean |
true |
是否显示边框 |
| appear.divided |
boolean |
true |
是否显示分隔线 |
| appear.gapped |
boolean |
false |
是否显示项目间隔 |
数据输出配置
| 属性名 |
类型 |
默认值 |
说明 |
| output |
boolean | object |
{} |
配置输出 |
| output.enable |
boolean |
true |
是否启用数据输出 |
| output.target |
string |
'' |
数据输出目标节点 |
| output.separator |
string |
',' |
多值分隔符 |
| output.prop |
string |
'label' |
取值属性 |
拖拽配置
| 属性名 |
类型 |
默认值 |
说明 |
| drag |
boolean |object |
{} |
配置拖拽 |
| drag.enable |
boolean |
false |
是否启用拖拽 |
| drag.exclude |
string |
'' |
不可拖拽节点选择器 |
| drop.attr |
string |
'dropnode' |
可释放节点属性 |
| drop.global |
boolean |
false |
是否全局释放 |
前置函数
| 属性名 |
类型 |
默认值 |
说明 |
| b4Expand |
Function |
null |
展开前执行 |
| b4Collapse |
Function |
null |
折叠前执行 |
| b4Add |
Function |
null |
新增前执行 |
| b4Edit |
Function |
null |
编辑前执行 |
| b4Remove |
Function |
null |
删除前执行 |
| b4Graft |
Function |
null |
拖拽前执行 |
事件监听
| 属性名 |
类型 |
默认值 |
说明 |
| onRendered |
Function |
null |
节点树创建完成后触发 |
| onTrigger |
Function |
null |
节点触发后触发 |
| onAdded |
Function |
null |
新增后触发 |
| onEdited |
Function |
null |
编辑后触发 |
| onRemoved |
Function |
null |
删除后触发 |
| onDisabled |
Function |
null |
禁用后触发 |
| onEnabled |
Function |
null |
启用后触发 |
| onDisabledAll |
Function |
null |
全部禁用后触发 |
| onEnabledAll |
Function |
null |
全部启用后触发 |
| onReadonly |
Function |
null |
设置只读后触发 |
| onReadonlyAll |
Function |
null |
全部只读后触发 |
| onExpand |
Function |
null |
展开时触发 |
| onExpanded |
Function |
null |
展开后触发 |
| onCollapse |
Function |
null |
折叠时触发 |
| onCollapsed |
Function |
null |
折叠后触发 |
| onExpandAll |
Function |
null |
全部展开时触发 |
| onExpandedAll |
Function |
null |
全部展开后触发 |
| onCollapsedAll |
Function |
null |
全部折叠后触发 |
| onSelected |
Function |
null |
选中后触发 |
| onDeselected |
Function |
null |
取消选中后触发 |
| onSelectedAll |
Function |
null |
全部选中后触发 |
| onChecked |
Function |
null |
勾选后触发 |
| onUnchecked |
Function |
null |
取消勾选后触发 |
| onCheckedAll |
Function |
null |
全部勾选后触发 |
| onFilled |
Function |
null |
填充brief后触发 |
| onTurned |
Function |
null |
翻页后触发 |
| onGot |
Function |
null |
取值后触发 |
| onSet |
Function |
null |
设置值后触发 |
| onCleared |
Function |
null |
清除值后触发 |
| onGrafted |
Function |
null |
拖拽完成后触发 |
| onUpdatedCont |
Function |
null |
内容更新后触发 |
| onRequest |
Function |
null |
异步请求完成后触发 |
| onTooFew |
Function |
null |
选中数量过少时触发 |
| onTooMany |
Function |
null |
选中数量过多时触发 |
| onPassivated |
Function |
null |
全局禁用后触发 |
| onActivated |
Function |
null |
取消全局禁用后触发 |
