diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md index 6c534fc9b..cb9c924da 100644 --- a/CHANGELOG.zh_CN.md +++ b/CHANGELOG.zh_CN.md @@ -12,6 +12,7 @@ - 新增部门管理示例界面 - 新增 WebSocket 示例和服务脚本 - BasicTree 组件新增 `renderIcon` 属性用于控制层级图标显示 +- BasicTree->actionItem 新增 show 属性,用于动态控制按钮显示 ### ⚡ Performance Improvements diff --git a/src/components/Tree/src/index.vue b/src/components/Tree/src/index.vue index 27a29b626..194fb4de0 100644 --- a/src/components/Tree/src/index.vue +++ b/src/components/Tree/src/index.vue @@ -16,7 +16,7 @@ // import { DownOutlined } from '@ant-design/icons-vue'; import { omit, get } from 'lodash-es'; - import { isFunction } from '/@/utils/is'; + import { isBoolean, isFunction } from '/@/utils/is'; import { extendSlots } from '/@/utils/helper/tsxHelper'; import { useTree } from './useTree'; @@ -116,6 +116,14 @@ const { actionList } = props; if (!actionList || actionList.length === 0) return; return actionList.map((item, index) => { + if (isFunction(item.show)) { + return item.show?.(node); + } + + if (isBoolean(item.show)) { + return item.show; + } + return ( {item.render(node)} @@ -147,7 +155,7 @@ > {get(item, titleField)} - {renderAction(item)} + {renderAction({ ...item, level })} ), default: () => diff --git a/src/components/Tree/src/types.ts b/src/components/Tree/src/types.ts index 54105b3ec..0d1ea7968 100644 --- a/src/components/Tree/src/types.ts +++ b/src/components/Tree/src/types.ts @@ -1,6 +1,7 @@ import type { TreeDataItem } from 'ant-design-vue/es/tree/Tree'; export interface ActionItem { - render: (record: any) => any; + render: (record: Recordable) => any; + show?: boolean | ((record: Recordable) => boolean); } export interface TreeItem extends TreeDataItem { diff --git a/src/views/demo/tree/EditTree.vue b/src/views/demo/tree/EditTree.vue index 30624bdd3..b31789a8e 100644 --- a/src/views/demo/tree/EditTree.vue +++ b/src/views/demo/tree/EditTree.vue @@ -46,6 +46,7 @@ } const actionList: ActionItem[] = [ { + // show:()=>boolean; render: (node) => { return h(PlusOutlined, { class: 'ml-2',