"Warning: u: `key` is not a prop" in console.

Great tree view component, very powerful and easy to use. Thank you for releasing it!

I just implemented it and followed the data structure as per the documentation. In my console react is throwing an error:

Warning: u: key is not a prop. Trying to access it will result in undefined being returned. If you need to access the same value within the child component, you should pass it as a different prop.

Is this something that I can fix or will it require a update to the component code?

Thank you!

[iannbing]

Ah, sorry my bad.

My example code above isn’t correct. In order to prevent all the warnings of such kind. You need a custom component to explicitly consumes the props instead of using native elements like li.

You can check how I implement it here.

[AvishekNath]

Still getting error --> Warning: u: key is not a prop. Trying to access it will result in undefined being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://fb.me/react-special-props)

Code–>

const treeData = [ { key: “first-level-node-1”, id: “first-level-node-1”, label: “Node 1 at the first level”, nodes: [ { key: “second-level-node-1”, id: “second-level-node-1”, label: “Node 1 at the second level”, nodes: [ { key: “third-level-node-1”, id: “third-level-node-1”, label: “Last node of the branch”, nodes: [] // you can remove the nodes property or leave it as an empty array } ] } ] }, { key: “first-level-node-2”, id: “first-level-node-2”, label: “Node 2 at the first level” } ];

<TreeMenu hasSearch={true} data={treeData} onClickItem={node => { //this.handleTreeClick(node); }} > {({ search, items }) => (

{items.map(({ key, …props }) => ( <ItemComponent {…props} key={props.id} /> ))}

)} </TreeMenu>

Please help!