Ant-design: Dynamic Tree with antd Tree & TreeNode

[drcmda]

const Leaf = ({ id }) => <Tree.TreeNode title={doing something dynamic here} />

...
<Tree>
    { instances.map(instance => <Leaf key={instance} id={instance} />) }
</Tree>

It looks like the ant tree is not dynamic/component oriented. There's no way to return a treenode without running into errors like TypeError: props.filterTreeNode is not a function.

I don't know how to solve this. Each leaf component must be reactive, there is no way that i could get all the nested data beforehand, unless i render the entire tree for each change, which isn't possible due to performance concerns.

[yesmeck]

Hello @drcmda, TreeNode can not be composed with the current architecture.

Change your code to:

<Tree>
    { instances.map(instance => 
      <Tree.TreeNode key={instance} title={doing something dynamic here} />) 
    }
</Tree>

[drcmda]

@yesmeck I'm afraid that isn't possible, because it would mean i need to have the nested structure beforehand, but only nested components know their their subcomponents (they're tied to state). I ended up writing my own tree, though. I have my hopes up this will be addressed one day. :)

[KaiVolland]

@yesmeck @benjycui @warmhug
Is there any chance that the TreeNode will become a standalone and composable class? As Tree and TreeNode are seperate classes in rc-tree this should be possible or am i wrong?

I'd really appreciate the TreeNode to be a standalone class as it would offer lots of possibilities and would feel more "reactish".