Browse Source

style: For Tree/TreeSelect with showLine set to true, when the top node is a leaf node, there should be no line in front of the top node

zhangyumei.0319 1 year ago
parent
commit
4a72e15a15
2 changed files with 22 additions and 2 deletions
  1. 19 0
      packages/semi-ui/tree/_story/tree.stories.jsx
  2. 3 2
      packages/semi-ui/tree/treeNode.tsx

+ 19 - 0
packages/semi-ui/tree/_story/tree.stories.jsx

@@ -207,6 +207,17 @@ const treeDataWithIcon = [
   },
 ];
 
+const OneLevelData = [
+  {
+    label: '亚洲',
+    key: 'yazhou',
+  },
+  {
+    label: '北美洲',
+    key: 'beimeizhou',
+  },
+]
+
 let opts = {
   content: 'Hi, Bytedance dance dance',
   duration: 3,
@@ -3078,6 +3089,14 @@ export const ShowLine = () => {
       defaultExpandAll
       disableStrictly
     />
+    <>单选,单层节点</>
+    <Tree
+      showLine={showLine}
+      treeData={OneLevelData}
+      // value="meiguo"
+      defaultExpandAll
+      onChange={(...args) => console.log(args)}
+    />
   </div>
   )
 }

+ 3 - 2
packages/semi-ui/tree/treeNode.tsx

@@ -203,7 +203,7 @@ export default class TreeNode extends PureComponent<TreeNodeProps, TreeNodeState
 
     renderArrow() {
         const showIcon = !this.isLeaf();
-        const { loading, expanded, showLine } = this.props;
+        const { loading, expanded, showLine, level } = this.props;
         if (loading) {
             return <Spin wrapperClassName={`${prefixcls}-spin-icon`} />;
         }
@@ -218,7 +218,8 @@ export default class TreeNode extends PureComponent<TreeNodeProps, TreeNodeState
                 />
             );
         }
-        if (showLine) {
+        // when leaf node 's level is 0, no switcher
+        if (showLine && level) {
             return this.renderSwitcher();
         }
         return (