树形展示

树形展示 是一个 基于 el-tree 封装的功能完整的低代码树形组件，支持懒加载、节点搜索、手风琴模式、节点菜单及创建操作，并提供与业务逻辑深度集成的事件与函数绑定能力。

基础属性

属性名	类型	默认值	说明
highlightCurrent	boolean	--	是否高亮当前选中节点
defaultExpandAll	boolean	--	是否默认展开所有节点
accordion	boolean	--	是否手风琴模式展开节点。每次只打开一个同级树节点展开
lazy	boolean	--	是否懒加载
expandOnClickNode	boolean	false	点击时是否展开或收缩节点
checkOnClickNode	boolean	true	点击时是否选中节点
loadData	Function（可执行函数）	return Promise.resolve([])	数据加载函数。懒加载情况下 $args[0] 为 node 数据
createButton	ActionButton	--	创建按钮
menuButtons	ActionButton[]	--	节点菜单按钮。$args[0] 为 node 数据

组件事件

事件名	说明
node-click	树节点点击时触发。若连续两次点击同一节点，则第二次会清空当前选中状态并触发无参回调；否则传入当前节点数据

上下文

该组件通过 exposeContext 暴露运行时上下文，使用方式如下：

• 在可执行函数（如事件函数、属性绑定函数）中，通过 $useExposeContext(key) 获取；
• 在自定义 Hook 或其他组件中，通过 useExposeContext(key) 获取。

exposeContext({
  refresh: () => refresh()
})

上下文内容：

键（key）	说明
refresh	重新加载组件

示例

参考 媒体库

数据加载函数（懒加载情况）

return (async () => {
    const { level, data } = $args[0]
    if (level == 0) {
        return [{ id: 0, name: '一级目录' }]
    } else {
        const resp = await $request({
            method: 'post',
            url: '/lowcode/deploy-api/lowcode-media-dir/select-list',
            data: {
                whereParams: [{
                    name: 'parentId',
                    symbol: 'EQ',
                    value: data.id
                }]
            }
        })
        return resp.data
    }
})()