ant-design/components/tree/demo/line.md
ddcat1115 27b099e58e feat: Tree with line & Tree customize icon demo (#5261)
* Tree with line & Tree customize icon demo

* improve
2017-03-21 09:41:02 +08:00

52 lines
1.1 KiB
Markdown

---
order: 5
title:
zh-CN: 连接线
en-US: Tree With Line
---
## zh-CN
带连接线的树。
## en-US
Tree With Line
````jsx
import { Tree } from 'antd';
const TreeNode = Tree.TreeNode;
class Demo extends React.Component {
onSelect = (selectedKeys, info) => {
console.log('selected', selectedKeys, info);
}
render() {
return (
<Tree
showLine
defaultExpandedKeys={['0-0-0']}
onSelect={this.onSelect}
>
<TreeNode title="parent 1" key="0-0">
<TreeNode title="parent 1-0" key="0-0-0">
<TreeNode title="leaf" key="0-0-0-0" />
<TreeNode title="leaf" key="0-0-0-1" />
<TreeNode title="leaf" key="0-0-0-2" />
</TreeNode>
<TreeNode title="parent 1-1" key="0-0-1">
<TreeNode title="leaf" key="0-0-1-0" />
</TreeNode>
<TreeNode title="parent 1-2" key="0-0-2">
<TreeNode title="leaf" key="0-0-2-0" />
<TreeNode title="leaf" key="0-0-2-1" />
</TreeNode>
</TreeNode>
</Tree>
);
}
}
ReactDOM.render(<Demo />, mountNode);
````