feat(tree): add defaultExpandLevel prop

新增defaultExpandLevel属性，指定默认要展开的层级数。-1为默认全部展开（等同于ATree的defaultExpandAll），大于0则展开到指定层级。注意：该属性仅在首次渲染时起作用 close: #672

feat(tree): add defaultExpandLevel prop
新增defaultExpandLevel属性，指定默认要展开的层级数。-1为默认全部展开（等同于ATree的defaultExpandAll），大于0则展开到指定层级。注意：该属性仅在首次渲染时起作用 close: #672
无木
1 parent 1ae63629
Showing 4 changed files with 25 additions and 4 deletions
src/components/Tree/src/Tree.vue
src/components/Tree/src/props.ts
src/views/demo/tree/data.ts
src/views/demo/tree/index.vue
@@ -11,6 +11,7 @@
     toRaw,
     watch,
     CSSProperties,
+    onMounted,
   } from 'vue';
   import { Tree, Empty } from 'ant-design-vue';
   import { TreeIcon } from './TreeIcon';
@@ -209,6 +210,16 @@
         treeDataRef.value = props.treeData as TreeItem[];
       });
  
+      onMounted(() => {
+        if (props.defaultExpandLevel === '') return;
+        const level = parseInt(props.defaultExpandLevel);
+        if (level === -1) {
+          expandAll(true);
+        } else if (level > 0) {
+          state.expandedKeys = filterByLevel(level);
+        }
+      });
+
       watchEffect(() => {
         state.expandedKeys = props.expandedKeys;
       });
@@ -23,6 +23,10 @@ export const basicProps = {
   checkStrictly: propTypes.bool,
   clickRowToExpand: propTypes.bool.def(true),
   checkable: propTypes.bool.def(false),
+  defaultExpandLevel: {
+    type: [String, Number] as PropType<string | number>,
+    default: '',
+  },
  
   replaceFields: {
     type: Object as PropType<ReplaceFields>,
@@ -10,7 +10,7 @@ export const treeData: TreeItem[] = [
         title: 'leaf',
         key: '0-0-1',
         children: [
-          { title: 'leaf', key: '0-0-0-0' },
+          { title: 'leaf', key: '0-0-0-0', children: [{ title: 'leaf', key: '0-0-0-0-1' }] },
           { title: 'leaf', key: '0-0-0-1' },
         ],
       },
 <template>
   <PageWrapper title="Tree基础示例">
     <div class="flex">
-      <BasicTree :treeData="treeData" title="基础示例" class="w-1/3" />
+      <BasicTree
+        :treeData="treeData"
+        title="基础示例，默认展开第一层"
+        defaultExpandLevel="1"
+        class="w-1/3"
+      />
  
       <BasicTree
         :treeData="treeData"
-        title="可勾选"
+        title="可勾选，默认全部展开"
         :checkable="true"
         class="w-1/3 mx-4"
+        defaultExpandLevel="-1"
         @check="handleCheck"
       />
  
       <BasicTree
-        title="默认展开/勾选示例"
+        title="指定默认展开/勾选示例"
         :treeData="treeData"
         :checkable="true"
         :expandedKeys="['0-0']"