树部件
以树形结构展示数据,每种树节点类型可指定不同的导航视图,支持节点动态展开/折叠,支持树节点拖拽。
常规
实体节点
搜索
导航传参
上下文菜单
拖拽
内置导航
界面样式及图标
事件
能力调用
树选择
加载更多模式
节点新建与编辑
树节点关系搜索模式
绘制器
树级联选择
上下文菜单触发器显示模式
阻止右键点击弹出上下文菜单
刷新模式
输入参数
名称 | 说明 | 类型 | 默认值 |
---|---|---|---|
modelData | 树模型数据 | Object as IDETree | - |
context | 应用上下文对象 | Object as IContext | - |
params | 视图参数对象 | Object as IParams | {} |
provider | 部件适配器 | Object as IControlProvider | - |
mdctrlActiveMode | 树节点默认激活模式,值为0:不激活,值为1:单击激活,值为2:双击激活 | Number | - |
singleSelect | 是否单选 | Boolean | - |
navigational | 是否是导航的 | Boolean | - |
defaultExpandedKeys | 默认展开节点集合 | Array as string[] | - |
loadDefault | 是否默认加载数据 | Boolean | true |
checkStrictly | 在显示复选框的情况下,是否严格的遵循父子不互相关联的做法 | Boolean | true |
isSimple | 是否是简单模式 | Boolean | false |
data | 简单模式下传入的数据 | Array<ITreeNodeData> | - |
状态
名称 | 说明 | 类型 | 默认值 |
---|---|---|---|
isCreated | 控制器是否走完created生命周期 | boolean | false |
isMounted | 控制器是否走完mounted生命周期 | boolean | false |
isDestroyed | 控制器是否走完destroy生命周期 | boolean | false |
context | 应用上下文对象 | IApiContext | {} |
activated | 当前部件是否为激活状态(缓存下的激活状态,一般与框架的生命周期相同) | boolean | false |
isSimple | 是否是简单模式,简单模式下不加载数据,而是由父组件传值 | boolean | false |
isLoading | 部件是否正在加载 | boolean | false |
loadDefault | 是否默认加载数据 | boolean | true |
disabled | 部件禁用状态 | boolean | false |
maskOption | 部件遮罩参数 | IApiMaskOption | - |
items | 树节点集合 | IApiTreeNodeData[] | [] |
selectedData | 选中节点集合 | IApiTreeNodeData[] | [] |
selectedKeys | 多数据部件选中数据主键集合 | string[] | - |
singleSelect | 是否是单项选择 | boolean | true |
mdctrlActiveMode | 多数据部件激活模式,0:无激活;1:单击激活;2:双击激活 | number | 0 | 1 | 2 | 0 |
curPage | 当前页 | number | 1 |
size | 分页条数 | number | 20 |
total | 总条数 | number | 0 |
totalx | 全部计数条数,数据集配置需勾选返回全部计数 | number | 0 |
totalPages | 总页数 | number | - |
isLoaded | 是否加载过数据,用于某些需要等待数据加载回来之后的场景。 | boolean | false |
searchParams | 搜索部件的查询参数 | IApiParams | {} |
noSort | 是否禁用排序 | boolean | false |
sortQuery | 排序查询条件 | string | '' |
groups | 分组数据 | IApiMDControlGroupState[] | [] |
hideNoDataImage | 隐藏无数据图片,该状态仅PC端使用。 | boolean | false |
enableNavView | 是否启用内置导航视图,该状态仅PC端使用。 | boolean | false |
showNavView | 是否显示内置导航视图,该状态仅PC端使用。 | boolean | false |
showNavIcon | 是否显示内置导航图标,导航视图显示模式为程序控制时不显示。该状态仅PC端使用。 | boolean | false |
showRowDetail | 是否显示行明细,该状态仅PC端(表格,列表)使用。 | boolean | false |
enableGroup | 是否启用分组,该状态仅PC端(表格,卡片,列表)使用。 | boolean | - |
defaultExpandedKeys | 外部提供的默认展开的节点集合 | string[] | [] |
rootNodes | 树的根节点 | IApiTreeNodeData[] | [] |
expandedKeys | 实际默认展开节点标识集合 | string[] | [] |
query | 查询条件 | string | '' |
placeHolder | 快速搜索占位符 | string | '' |
mobExpandedKey | 移动端展开节点标识(存储最后展开节点的标识) | string | '' |
控制器
名称 | 说明 | 类型 |
---|---|---|
id | 控制器实例的唯一标识,创建时自动生成 | string |
state | 状态对象,泛型 | S |
model | 模型对象,泛型 | T |
context | 应用上下文对象 | IApiContext |
params | 视图参数对象 | IApiParams |
view | 当前视图控制器 | IApiViewController & IApiData |
ctrlId | 部件标识 | string |
controlParams | 部件参数 | IApiParams |
layoutPanel | 部件布局面板控制器 | IApiViewLayoutPanelController & IApiData |
runMode | 运行模式(DESIGN:设计模式,RUNTIME:运行时) | 'DESIGN' | 'RUNTIME' |
force | 强制更新,触发render函数 | (_callback?: () => void) => void |
startLoading | 开始加载 | () => Promise<void> |
endLoading | 加载完毕 | () => Promise<void> |
getControlType | 获取部件类型 | () => string |
enable | 取消部件禁用 | () => void |
disabled | 设置部件禁用 | (options?: IApiMaskOption) => void |
emitDEDataChange | 触发实体数据变更的通知 | (type: 'create' | 'update' | 'remove', data: IApiData) => void |
setSort | 设置排序 | (key?: string, order?: 'asc' | 'desc') => void |
loadMore | 加载更多 | () => Promise<void> |
load | 加载数据 | (args?: IApiMDCtrlLoadParams) => Promise<IApiData[]> |
remove | 删除数据 | (args?: IApiMDCtrlRemoveParams) => Promise<void> |
refresh | 刷新数据 | () => Promise<void> |
importData | 导入数据 | () => Promise<void> |
getData | 获取选中数据 | () => IApiData[] |
setSelection | 设置选中数据,设置的数据和已经选中的一样时会触发onSelectionChange事件 | (selection: IApiData[], isEmit?: boolean) => void |
setActive | 设置激活数据 | (data: IApiData, event?: MouseEvent | undefined) => Promise<void> |
goToFirstPage | 跳转第一页 | () => Promise<IApiData[]> |
goToPreviousPage | 跳转上一页 | () => Promise<IApiData[]> |
goToNextPage | 跳转下一页 | () => Promise<IApiData[]> |
goToLastPage | 跳转最后一页 | () => Promise<IApiData[]> |
selectAll | 选中全部数据 | (state?: boolean) => void |
execGroup | 执行多数据分组 | (arg: IApiMDGroupParams[], params?: IApiParams) => Promise<void> |
setSelectedData | 设置选中数据 | (items: IData[]) => void |
newRow | 新建行 | (args?: IApiMDCtrlLoadParams) => Promise<void> |
refreshNodeChildren | 刷新指定树节点的子节点数据 | (nodeData: IApiTreeNodeData | IApiData, refreshParent?: boolean) => Promise<void> |
expandNodeByKey | 展开并加载节点 | (expandedKeys: string[]) => Promise<void> |
changeCollapse | 展开/收缩节点 | (params?: IApiData) => void |
getNodeModel | 获取节点模型 | (id: string) => IDETreeNode | undefined |
getNodeData | 通过标识获取节点数据 | (key: string) => IApiTreeNodeData | undefined |
newTreeNode | 新建树节点 | (_params: IApiNewTreeNodeParams) => void |
事件
名称 | 描述 | 类型 |
---|---|---|
onCreated | 自身的准备工作完成(如模型加载,各种初始化,init结束) | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onMounted | 没有下级组件created之后的生命周期,有下级时需要等所有下级组件onMounted完成后触发 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onBeforeDestroy | 组件销毁前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onDestroyed | 自身组件被销毁时触发 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onActivated | 自身组件重新激活 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onDeactivated | 自身组件暂时停用 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onUIAction | 界面行为执行 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onRefreshSuccess | 刷新成功 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onActive | 数据激活事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onSelectionChange | 选中数据变更事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onBeforeSave | 保存之前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onSaveSuccess | 保存成功后 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onSaveError | 保存失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onBeforeRemove | 删除之前 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onRemoveSuccess | 删除成功之后 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onRemoveError | 删除失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onBeforeLoad | 加载前事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onLoadSuccess | 加载后处理事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onLoadError | 加载失败 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onNavDataChange | 导航数据变更 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onAfterRefreshParent | 父节点刷新结束之后事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onAfterNodeDrop | 树节点拖入变更处理完成后事件 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
onNewTreeNode | 新建树节点 | {eventName:string, context:IApiContext, params:IApiParams, data:IApiData[], targetName:string, view:IApiViewController, ctrl:IApiControlController, [key: string]: any} |
控件动态参数
名称 | 说明 | 类型 | 默认值 |
---|---|---|---|
cascadeselect | 在显示复选框的情况下,是否严格的遵循父子不互相关联的做法,默认为 false | boolean | false |
contextmenurightclickinvoke | 当该值为false时,拦截右键点击事件不弹出节点的右键上下文菜单 | boolean | true |
menushowmode | 上下文菜单的显示时机支持两种配置模式:始终显示的 'default' 模式,以及仅鼠标悬停树节点时显示对应菜单的 'hover' 模式 | 'default' | 'hover' | 'default' |
mdctrlrefreshmode | 多数据部件刷新模式,当值为 'cache',部件刷新时保留选中数据;当值为 'nocache',部件刷新时清空选中数据 | 'nocache' | 'cache' | 'cache' |
searchphseparator | 搜索栏输入框根据该值将所有输入项提示文本进行拼接展示 | string | 、 |