API
基础组件

AppTree

# 一、属性

# height

number | string

树高度。

# tree

object

树配置项。

# tree.name

string

树名称。

默认值： 'tree'

# tree.noFind

boolean

是否没有默认查询输入框。

默认值: false

# tree.replaceFields

object

替换 treeNode 中 title,key,children,value 字段为 treeData 中对应的字段。

默认值: { children: 'children', title: 'title', key: 'id' }

# tree.isChecked

boolean

节点前添加 Checkbox 复选框。

默认值: false

# tree.checkStrictly

boolean

父子节点选中状态是否不再关联。

默认值: false

# tree.defaultExpandAll

boolean

默认展开所有树节点。

默认值: false

# tree.defaultExpandParent

boolean

默认展开父节点。

默认值: true

# tree.openLevel

number

默认展开层级。

# tree.selectedRoot

boolean

是否选中根节点。

# tree.disabled

boolean

是否禁用。

默认值: false

# tree.draggable

boolean

树节点是否可拖拽。

默认值: false

# tree.showIcon

boolean

是否展示树节点前的图标。

默认值: false

# tree.showLine

boolean

是否展示连接线。

默认值: false

# tree.lazyLoad

boolean

是否需要懒加载。

默认值: false

# tree.showBadge

boolean | ({ title, record: dataRef, expanded, children }) => boolean

是否显示小红点。

默认值: false

# tree.upload

object

上传附件功能配置。

object 属性说明:

tableId: string: 业务表
valueId: string: 业务 id
countfield: string: 附件数量字段

# tree.rightMenu

boolean

是否使用右键菜单。

默认值： false

# tree.isPage

boolean

是否分页。

默认值： false

# tree.tbar

array<...columns>

分页左侧按钮。当 tree.isPage 为 true 时有效。

array 属性说明:

...columns: 支持 AppToolbar - toolbar 的所有配置
method({ editType, checkboxRecords, findFormData, isEditGrid }): 按钮的点击事件
iconCls: string: 按钮的图标

# tree.autoRetrieve

boolean

是否自动发起请求。

默认值: true

# tree.findUrl

string

查询请求地址。

# tree.remoteSearch

boolean

是否远程搜索。

默认值： false

# tree.moveUrl

string

拖拽移动节点的请求地址。

# tree.copyUrl

string

拖拽复制节点的请求地址。

# app

string

标记当前组件是在哪个功能组件中使用的。

默认值: 'tree'

# 二、方法

# getAppTree()

获取树对象。

调用此方法后，可使用的属性:

treeName: 树名称
selectedTreeNode: 选中的树节点
rootNode: 根节点对象

调用此方法后，可使用的方法:

getSelectRecords(): 获取选中记录
getTreeDataByFindUrl(): 调用查询接口（使用当前页），加载树的数据
reset(): 重置树的状态
setSelectedTreeNode(data): 设置选中树节点
resetSelectedTreeNode(): 重置选中的树节点
setSearchContent(content): 设置搜索内容

# 三、事件

# afterConstructor

({ that, tree }) => void

初始化完成之后执行。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  afterConstructor: ({ that, tree }) => {}
}

1
2
3
4

# treeFindBefore

({ that, tree, back }) => void

初始化完成之后执行。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- back: (continueExec) => void: 是否需要拦截后续代码时调用，默认继续执行。back(false) 即可拦截。

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  treeFindBefore: ({ that, tree }) => {}
}

1
2
3
4

# treeFindAfter

({ that, tree, res, process }) => void

初始化完成之后执行。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- res: object: 接口响应数据
- process: (res) => void: 处理响应数据

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  treeFindAfter: ({ that, tree }) => {}
}

1
2
3
4

# treeRetrieveEnd

({ that, tree, back }) => void

初始化完成之后执行。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- back: (continueExec) => void: 是否需要拦截后续代码时调用，默认继续执行。back(false) 即可拦截。

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  treeFindBefore: ({ that, tree }) => {}
}

1
2
3
4

# treeSelectClick

({ that, tree, selectedKeys, selected, selectedNodes, node }) => void

树节点选中事件。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- selectedKeys: array: 选中树节点的 key 集合
- selected: boolean: 是否选中
- selectedNodes: array: 选中的树节点对象集
- node: array: 选中的树节点对象

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  treeFindBefore: ({ that, tree, selectedKeys, selected, selectedNodes, node }) => {}
}

1
2
3
4

# treeCheckClick

({ that, tree, checkedKeys, checked, checkedNodes, node }) => void

树节点勾选事件。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- checkedKeys: array: 勾选树节点的 key 集合
- checked: boolean: 是否勾选
- checkedNodes: array: 勾选的树节点对象集
- node: array: 勾选的树节点对象

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  treeCheckClick: ({ that, tree, checkedKeys, checked, checkedNodes, node }) => {}
}

1
2
3
4

# onExpendAllBefore

({ that, tree, nodeData, back }) => void

树节点展开所有前事件。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- nodeData: object: 树节点的数据对象
- back: (continueExec) => void: 是否需要拦截后续代码时调用，默认继续执行。back(false) 即可拦截。

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  onExpendAllBefore: ({ that, tree, nodeData, back }) => {}
}

1
2
3
4

# onDragBefore

({ that, tree, nodeData, back }) => void

树节点展开所有前事件。

参数说明:

obj
- that: object: 当前组件的实例对象不建议使用
- tree: object: 树对象推荐
- nodeData: object: 树节点的数据对象
- back: (continueExec, message) => void: 是否需要拦截后续代码时调用，默认继续执行。back(false) 即可拦截。

提示

该方法可直接挂载至 tree 下。

tree: {
  // ...
  onDragBefore: ({ that, tree, nodeData, back }) => {}
}

1
2
3
4

← AppList BasicForm→