Problem

When using React Router, the following pattern appears frequently:

this.props.children

But how does the parent component pass props to a component rendered this way?

Solution

We can pass props to child components like this:

{ 
    React.cloneElement(this.props.children,{A:xxx,B:xxx2,C:xxx3}) 
    
 }

Article Link: