fix(tree): the height attribute does not work (#3717)

* fix(tree): the height attribute does not work * test(tree): the height attribute does not work
Tencent · Dec 10, 2023 · 69f2288 · 69f2288
1 parent 9fdcf45
commit 69f2288
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 6 deletions.
diff --git a/src/tree/hooks/useTreeStyles.ts b/src/tree/hooks/useTreeStyles.ts
@@ -52,6 +52,7 @@ export default function useTreeStyles(state: TypeTreeState) {
   const treeContentStyles = computed<TypeStyles>(() => ({
     height: formatCSSUnit(height.value),
     maxHeight: formatCSSUnit(maxHeight.value),
+    overflowY: formatCSSUnit(height.value) || formatCSSUnit(maxHeight.value) ? 'auto' : undefined,
   }));
 
   const scrollStyles = computed<TypeStyles>(() => {

diff --git a/test/unit/snap/__snapshots__/csr.test.js.snap b/test/unit/snap/__snapshots__/csr.test.js.snap
@@ -187417,7 +187417,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/debug-vscroll.vue 1`]
   >
     <div
       class="t-tree t-tree--hoverable t-tree--checkable t-tree--transition"
-      style="height: 300px;"
+      style="height: 300px; overflow-y: auto;"
     >
       <!---->
       <div
@@ -196687,7 +196687,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/vscroll.vue 1`] = `
   >
     <div
       class="t-tree t-tree--hoverable t-tree--checkable t-tree--transition t-tree__vscroll"
-      style="height: 300px;"
+      style="height: 300px; overflow-y: auto;"
     >
       <div
         class="t-tree__vscroll-cursor"
@@ -199370,7 +199370,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/vscroll-lazy.vue 1`] =
       >
         <div
           class="t-tree t-tree--hoverable t-tree--transition t-tree__lazyload"
-          style="height: 300px;"
+          style="height: 300px; overflow-y: auto;"
         >
           <!---->
           <transition-group-stub