UNPKG

maycur-business

Version:

maycur business react components of web

33 lines (28 loc) 2.86 kB
### MkTree 树形组件 #### defaultProps |name|type|description|default| |:--|:--|:--|:--| |keyName|string|关键字(唯一标识)名称|"code"| |childrenName|string|子集名称|"chidren"| |titleName|string|节点名称|"title"| |needAction|boolean|是否需要操作按钮|true| |leafIcon|string|叶子节点图标|"paper"| |folderIcon|string|含叶子节点(父节点)|"folder-o"| |alertInfo|object|antd Alert组件的参数,用于在tree中显示提示|{}| #### props |name|type|description|特殊说明| |:--|:--|:--|:--| |onClickItem|function(node)|点击节点时触发 当前节点数据作为参数传入 供使用组件者操作|| |loadData|function(node)|展开当前节点时触发 将当前节点数据作为参数传入 供使用组件者操作|该函数必需返回一个promise函数, 需将请求到的子节点resolve回 MkTree| |nodeTemplate|function(isLeaf,parentNode)|点击添加时会触发,会将是否点击添加叶子节点和当前节点数据传入 供使用组件者操作|改函数需根据isLeaf 和 parentNode返回一个新节点, MkTree会将该节点添加到树形结构中| |onSearch|function(query)|搜索时触发,会将searchKey作为参数传入| 该函数需要返回一个promise函数,将请求到的数据resove回 MkTree| removeRemoteNode|function(node)|删除远程节点时触发 会将当前节点数据作为参数 供使用组件者操作|只有删除远程节点时(即有keyName的节点)需要调用此函数(没有keyName的节点因为无需远程删除,MkTree内部会处理无需使用者处理),该函数需返回一个promise 当删除成功后reslove,之后MkTree才会删除对应节点及子节点 |currentNode|object|当前选中节点|如果外部需要改变某个节点属性,需要在调用 onClickItem 后将该函数的 node 值赋给currentNode,修改属性后重新setState currentNode,MkTree内部会监听变化维护当前node属性 |isSync|Boolean|是否是同步树|可见下方其他说明第2点:该参数主要获知该树是否为非异步请求节点的树| |defaultExpandedKeys|array|默认展开节点 [keyName]|| |renderIcon|function(node)|自定义render icon 将当前节点数据作为参数传入|该函数需返回一个reactelement或者原生dom节点| |renderExtra|function(node)|自定义render 自定义后面的额外区域 将当前节点数据作为参数传入|该函数需返回一个reactelement或者原生dom节点| ### 其他说明 1.更新 currentNode 的时候 如果 需要当前节点为保存状态 在setState之前需要 调用一下MKTree 的 onSave 方法 2.异步树可以在item上设置hasChildren控制文件夹下拉图标的显示。同步树需要在MKTree上设置一个isSync的参数,无需设置item.hasChildren,因会通过children判断。 其他参数及方法 参考 antd 的 tree组件