Last active
March 27, 2024 10:06
-
-
Save dandelany/1ff06f4fa1f8d6f89c5e to your computer and use it in GitHub Desktop.
Recursively cloning React children
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var RecursiveChildComponent = React.createClass({ | |
render() { | |
return <div> | |
{this.recursiveCloneChildren(this.props.children)} | |
</div> | |
}, | |
recursiveCloneChildren(children) { | |
return React.Children.map(children, child => { | |
if(!_.isObject(child)) return child; | |
var childProps = {someNew: "propToAdd"}; | |
childProps.children = this.recursiveCloneChildren(child.props.children); | |
return React.cloneElement(child, childProps); | |
}) | |
} | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What if a child component has no children, but returns a tree, and you want to recursively clone / modify the returned tree?