Skip to content

Commit 1535747

Browse files
committed
Update README.md
1 parent b507ce9 commit 1535747

File tree

1 file changed

+30
-0
lines changed

1 file changed

+30
-0
lines changed

README.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ npm install --save react-infinite-tree
2828
## Example
2929
```jsx
3030
import React from 'react';
31+
import classNames from 'classnames';
3132
import InfiniteTree from 'react-infinite-tree';
3233
import 'react-infinite-tree/dist/react-infinite-tree.css';
3334

@@ -79,6 +80,35 @@ class App extends React.Component {
7980
done(null, nodes);
8081
}, 1000);
8182
}}
83+
rowRenderer={(node, treeOptions) => {
84+
const { id, name, loadOnDemand = false, children, state, props = {} } = node;
85+
86+
return (
87+
<div
88+
className={classNames(
89+
'infinite-tree-item',
90+
{ 'infinite-tree-selected': selected }
91+
)}
92+
data-id={id}
93+
>
94+
<div
95+
className="infinite-tree-node"
96+
style={{ marginLeft: depth * 18 }}
97+
>
98+
{!more && loadOnDemand &&
99+
<a className={classNames(treeOptions.togglerClass, 'infinite-tree-closed')}></a>
100+
}
101+
{more && open &&
102+
<a className={classNames(treeOptions.togglerClass)}></a>
103+
}
104+
{more && !open &&
105+
<a className={classNames(treeOptions.togglerClass, 'infinite-tree-closed')}></a>
106+
}
107+
<span className="infinite-tree-title">{name}</span>
108+
</div>
109+
</div>
110+
);
111+
}}
82112
selectable={true}
83113
shouldSelectNode={(node) => {
84114
if (!node || (node === this.tree.getSelectedNode())) {

0 commit comments

Comments
 (0)