feat: tree 支持根节点 label slot

components/tree/props.ts

@@ -4,6 +4,7 @@ import type {
     InjectionKey,
     PropType,
     Ref,
+    Slots,
 } from 'vue';
 import { extractPropsDefaultValue } from '../_util/utils';
 import type { ExtractPublicPropTypes } from '../_util/interface';
@@ -121,6 +122,7 @@ export type TreeProps = ExtractPublicPropTypes<typeof treeProps>;
 
 export interface TreeInst {
     props: TreeProps;
+    slots: Slots;
     selectNode: (value: TreeNodeKey, event: Event) => void;
     expandNode: (value: TreeNodeKey, event: Event) => void;
     checkNode: (value: TreeNodeKey, event: Event) => void;

components/tree/tree.tsx

@@ -41,7 +41,7 @@ export default defineComponent({
         'dragend',
         'drop',
     ],
-    setup(props, { emit, expose }) {
+    setup(props, { emit, expose, slots }) {
         useTheme();
         const { nodeList, allKeys } = useData({
             props,
@@ -123,6 +123,7 @@ export default defineComponent({
 
         provide(TREE_PROVIDE_KEY, {
             props,
+            slots,
             selectNode,
             expandNode,
             checkNode,
@@ -188,22 +189,22 @@ export default defineComponent({
         return () =>
             props.virtualList && !props.inline
                 ? (
-                    <VirtualList
-                        dataSources={currentData.value}
-                        dataKey={(source: TreeNodeKey) => {
-                            return source;
-                        }}
-                        estimateSize={32}
-                        keeps={14}
-                        observeResize={false}
-                        class={prefixCls}
-                        v-slots={{ default: renderDefault }}
-                    />
+                        <VirtualList
+                            dataSources={currentData.value}
+                            dataKey={(source: TreeNodeKey) => {
+                                return source;
+                            }}
+                            estimateSize={32}
+                            keeps={14}
+                            observeResize={false}
+                            class={prefixCls}
+                            v-slots={{ default: renderDefault }}
+                        />
                     )
                 : (
-                    <div class={prefixCls} role="tree">
-                        {renderChildren(currentData.value)}
-                    </div>
+                        <div class={prefixCls} role="tree">
+                            {renderChildren(currentData.value)}
+                        </div>
                     );
     },
 });

components/tree/treeNode.tsx

@@ -18,6 +18,7 @@ import FEllipsis from '../ellipsis';
 import TextHightlight from '../text-highlight';
 import { COMPONENT_NAME, INDENT } from './const';
 import useTreeNode from './useTreeNode';
+import type { TreeOption } from './interface';
 
 const prefixCls = getPrefixCls('tree-node');
 
@@ -27,7 +28,7 @@ const treeNodeProps = {
         required: true,
     },
     label: {
-        type: [String, Function] as PropType<string | (() => VNodeChild)>,
+        type: [String, Function] as PropType<string | ((node: TreeOption) => VNodeChild)>,
         required: true,
     },
     disabled: {
@@ -191,9 +192,9 @@ export default defineComponent({
             const icon = isLoading.value
                 ? <LoadingOutlined />
                 : (
-                    <CaretDownOutlined
-                        class={[`${prefixCls}-switcher-icon`, isExpanded.value ? 'is-expanded' : '']}
-                    />
+                        <CaretDownOutlined
+                            class={[`${prefixCls}-switcher-icon`, isExpanded.value ? 'is-expanded' : '']}
+                        />
                     );
 
             return (
@@ -256,10 +257,17 @@ export default defineComponent({
         };
 
         const renderLabel = () => {
+            const node = root.nodeList.get(props.value);
             if (isFunction(props.label)) {
                 return (
                     <span class={`${prefixCls}-content-label`}>
-                        {props.label()}
+                        {props.label(node)}
+                    </span>
+                );
+            } else if (isFunction(root.slots.label)) {
+                return (
+                    <span class={`${prefixCls}-content-label`}>
+                        {root.slots.label(node)}
                     </span>
                 );
             }
@@ -269,9 +277,9 @@ export default defineComponent({
                 >
                     {root.props.filterTextHighlight && root.props.filterText
                         ? (
-                            <TextHightlight strict searchValues={[root.props.filterText]}>
-                                {props.label}
-                            </TextHightlight>
+                                <TextHightlight strict searchValues={[root.props.filterText]}>
+                                    {props.label}
+                                </TextHightlight>
                             )
                         : props.label
                     }

docs/.vitepress/components/tree/index.md

@@ -125,6 +125,12 @@ app.use(FTree);
 | expandNode | 展开树节点     | (value)      |
 | checkNode  | check 节点     | (value)      |
 
+## Tree Slots
+
+| 名称    | 说明                           |
+| ------- | ------------------------------ |
+| label | treeOption 优先级比这个高             |
+
 ## TreeOption props
 
 | 属性        | 说明                                                 | 类型                        | 默认值  |