All files / src/tree/_example TreeIconExample.jsx

100% Statements 4/4
100% Branches 2/2
100% Functions 2/2
100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31          1x 3x     1x   1x                                      
import React from "react";
import { Tree } from "@tencent/tea-component/lib/tree";
import { Icon } from "@tencent/tea-component/lib/icon";
 
export default function TreeIconExample() {
  const parentIcon = ({ expanded }) => (
    <Icon type={expanded ? "folderopen" : "folderclose"} />
  );
 
  const leafIcon = <Icon type="phone" />;
 
  return (
    <Tree
      activable
      onActive={console.log}
      defaultExpandedIds={["0-0", "0-0-0"]}
    >
      <Tree.Node id="0-0" content="0-0" icon={parentIcon}>
        <Tree.Node id="0-0-0" content="0-0-0" icon={parentIcon}>
          <Tree.Node id="0-0-0-1" content="0-0-0-1" icon={leafIcon} />
          <Tree.Node id="0-0-0-2" content="0-0-0-2" icon={leafIcon} />
        </Tree.Node>
        <Tree.Node id="0-0-1" content="0-0-1" icon={parentIcon}>
          <Tree.Node id="0-0-1-1" content="0-0-1-1" icon={leafIcon} />
          <Tree.Node id="0-0-1-2" content="0-0-1-2" icon={leafIcon} />
        </Tree.Node>
      </Tree.Node>
    </Tree>
  );
}