[QUESTION] How can I render children nodes inside their parents?

[sfehlandt]

Hi, I have been trying to make a virtualized material-ui TreeView. I am trying to use react-vtree but in order to make it work I need to render children nodes inside their parent. E.g:

<TreeItem>
  <TreeItem>
    <TreeItem>
    </TreeItem>
  </TreeItem>
  <TreeItem>
    <TreeItem>
    </TreeItem>
  </TreeItem>
</TreeItem>

Is there anyway I can achieve this? As far as I can see, your examples render all the elements in the same level (like a list).

Thanks

[Lodin]

Hi @sfehlandt!

Thank you for your interest in react-vtree!

Unfortunately, I don't think it is possible. The virtualization approach assumes that you render a list of flat elements. The system knows the height of each element, and using the height of the container calculates the number of elements to display (read more). Nested elements would break that system completely.

I'm afraid you would need to find a component that does not depend on nested elements or create it yourself.

[sfehlandt]

Thanks @Lodin , I understand. I think I'll try to build my own component and replicate the looks of the material-ui TreeView but keeping it as a list.

Thank you very much for your reply.