How to pass props to {this.props.children}

Question

I\'m trying to find the proper way to define some components which could be used in a generic way:

Answer 1

For a slightly cleaner way to do it, try:

    {React.cloneElement(this.props.children, { loggedIn: this.state.loggedIn })}

Edit: To use with multiple individual children (the child must itself be a component) you can do. Tested in 16.8.6

    {React.cloneElement(props.children[0], { loggedIn: true, testingTwo: true })}
    {React.cloneElement(props.children[1], { loggedIn: true, testProp: false })}