iannbing / iannbing/react-simple-tree-menu
Vertical lines to show connection between nodes
- Dominant language
- TypeScript
- Stars
- 138
- Forks
- 44
- PR merge metrics
- No merged PRs in 30d
Description
Hi. Is it possible to make a tree which contains vertical lines connected between nodes with the current implementation?
F.e. add some flag to toggle the structure of `items` from renderProps to the "nested tree" type. Every item will have a `childNodes` property ?
```js
[
{
"index": 0,
"parent": "",
"level": 0,
"key": "1",
....otherInjectedProps
},
{
"index": 1,
"parent": "",
"level": 0,
"key": "2",
....otherInjectedProps
},
{
"index": 1,
"parent": "2",
"level": 1,
"key": "2/7",
....otherInjectedProps
},
{
"index": 2,
"parent": "",
"level": 0,
"key": "4",
}
]
```
to
```
[
{
"index": 0,
"parent": "",
"level": 0,
"key": "1",
....otherInjectedProps
},
{
"index": 1,
"parent": "",
"level": 0,
"key": "2",
childNodes: [
{
"index": 1,
"parent": "2",
"level": 1,
"key": "2/7",
....otherInjectedProps
}
],
....otherInjectedProps
},
{
"index": 2,
"parent": "",
"level": 0,
"key": "4",
}
]
```
And than use some sort of component recursion
```js
const TreeItem = ({data}) => (
-
{item.label}
{item.childNodes && }
{data && data.map(item => (
))}
);
```
Contributor guide
Assessment
This issue has not been assessed yet.