From e168591c4f9e061f5b1a4a0bdbe81a49cc78d523 Mon Sep 17 00:00:00 2001
From: 1zumii <524123601@qq.com>
Date: Fri, 14 Jun 2024 19:04:44 +0800
Subject: [PATCH] =?UTF-8?q?fix(Tree):=20=E4=BC=98=E5=8C=96=E9=A1=B6?=
 =?UTF-8?q?=E5=B1=82=20node=20=E7=9A=84=20no=20expand=20=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/tree/props.ts                  |  1 -
 components/tree/tree.tsx                  |  9 ++++--
 components/tree/treeNode.tsx              | 39 ++++++++++++-----------
 components/tree/useData.ts                |  8 ++---
 docs/.vitepress/components/tree/async.vue |  2 +-
 5 files changed, 32 insertions(+), 27 deletions(-)

diff --git a/components/tree/props.ts b/components/tree/props.ts
index 34539049..3bc89eb0 100644
--- a/components/tree/props.ts
+++ b/components/tree/props.ts
@@ -123,7 +123,6 @@ export interface TreeInst {
     expandNode: (value: TreeNodeKey, event: Event) => void;
     checkNode: (value: TreeNodeKey, event: Event) => void;
     hasSelected: (value: TreeNodeKey) => boolean;
-    hasNoExpandableNode: ComputedRef<boolean>;
     nodeList: Map<TreeNodeKey, InnerTreeOption>;
     handleDragstart: (value: TreeNodeKey, event: DragEvent) => void;
     handleDragenter: (value: TreeNodeKey, event: DragEvent) => void;
diff --git a/components/tree/tree.tsx b/components/tree/tree.tsx
index d53471ce..fe752231 100644
--- a/components/tree/tree.tsx
+++ b/components/tree/tree.tsx
@@ -127,7 +127,6 @@ export default defineComponent({
             expandNode,
             checkNode,
             hasSelected,
-            hasNoExpandableNode,
             nodeList,
             handleDragstart,
             handleDragenter,
@@ -141,6 +140,7 @@ export default defineComponent({
 
         const renderNode = (value: TreeNodeKey) => {
             const node = nodeList.get(value);
+
             const itemSlots: {
                 [key: string]: () => VNodeChild | string;
             } = {};
@@ -156,6 +156,10 @@ export default defineComponent({
             if (isString(node.suffix)) {
                 itemSlots.suffix = () => node.suffix as string;
             }
+
+            // 当前 node 在最顶层，且顶层所有 node 都没有 children
+            const noExpand = node.level === 1 && hasNoExpandableNode.value;
+
             return (
                 <TreeNode
                     key={node.uid}
@@ -170,7 +174,8 @@ export default defineComponent({
                     draggable={
                         props.draggable && !props.inline && !node.disabled
                     }
-                ></TreeNode>
+                    noExpand={noExpand}
+                />
             );
         };
 
diff --git a/components/tree/treeNode.tsx b/components/tree/treeNode.tsx
index c8e8e343..aa406b75 100644
--- a/components/tree/treeNode.tsx
+++ b/components/tree/treeNode.tsx
@@ -49,6 +49,10 @@ const treeNodeProps = {
         type: Boolean,
         default: false,
     },
+    noExpand: {
+        type: Boolean,
+        default: false,
+    },
 } as const satisfies ComponentObjectPropsOptions;
 
 export type TreeNodeProps = Partial<ExtractPropTypes<typeof treeNodeProps>>;
@@ -174,28 +178,25 @@ export default defineComponent({
             return null;
         };
         const renderSwitcher = () => {
-            const switcherClassList = [
-                `${prefixCls}-switcher`,
-                root.hasNoExpandableNode.value && 'no-expand',
-            ].filter(Boolean);
-
             if (props.isLeaf) {
-                return <span class={switcherClassList} />;
+                const leafClass = [`${prefixCls}-switcher`];
+                if (props.noExpand) {
+                    leafClass.push('no-expand');
+                }
+                return <span class={leafClass} />;
             }
+
+            const icon = isLoading.value
+                ? <LoadingOutlined />
+                : (
+                    <CaretDownOutlined
+                        class={[`${prefixCls}-switcher-icon`, isExpanded.value ? 'is-expanded' : '']}
+                    />
+                    );
+
             return (
-                <span class={switcherClassList} onClick={handleClickSwitcher}>
-                    {isLoading.value
-                        ? (
-                            <LoadingOutlined />
-                            )
-                        : (
-                            <CaretDownOutlined
-                                class={[
-                                `${prefixCls}-switcher-icon`,
-                                isExpanded.value ? 'is-expanded' : '',
-                                ]}
-                            />
-                            )}
+                <span class={`${prefixCls}-switcher`} onClick={handleClickSwitcher}>
+                    {icon}
                 </span>
             );
         };
diff --git a/components/tree/useData.ts b/components/tree/useData.ts
index 0e63a25d..e922ee2b 100644
--- a/components/tree/useData.ts
+++ b/components/tree/useData.ts
@@ -80,7 +80,7 @@ export default ({ props, emit }: { props: TreeProps; emit: any }) => {
         indexPath: TreeNodeKey[] = [],
         level = 1,
         parent: InnerTreeOption = undefined,
-    ) =>
+    ): TreeNodeKey[] =>
         nodes.reduce((res, node) => {
             const copy = transformNode(node, indexPath, level);
             // 收集 parent
@@ -100,11 +100,11 @@ export default ({ props, emit }: { props: TreeProps; emit: any }) => {
                 );
                 copy.children = children;
                 copy.childrenPath = keys;
-                // 比Array.concat快
-                concat(res as InnerTreeOption[], keys);
+                // 比 Array.concat 快
+                concat(res, keys);
             }
             return res;
-        }, []) as TreeNodeKey[];
+        }, [] as TreeNodeKey[]);
 
     watch(
         [() => props.data],
diff --git a/docs/.vitepress/components/tree/async.vue b/docs/.vitepress/components/tree/async.vue
index 388bf378..15fdfb62 100644
--- a/docs/.vitepress/components/tree/async.vue
+++ b/docs/.vitepress/components/tree/async.vue
@@ -39,7 +39,7 @@ function createLabel(level) {
 
 export default {
     setup() {
-        const data = reactive(createData(2));
+        const data = reactive(createData(1));
         const loadData = (node) => {
             return new Promise((resolve) => {
                 setTimeout(() => {