Hi everyone,

A quick post on how to pass a component as a prop and then render it as a child.

const ChildComponent = () => 
Child Component
;

const MainComponent = (props) => 
Main component. Child appears below
{props.content}
;

class App extends React.Component {

  render () {                                        
    return (
      
          
          <MainComponent content={} />          
      
    );
  }
}

An alternative to all of this that I wasn’t aware of is to to use “children”:

See the Pen ozqNOV by Dan Abramov (@gaearon) on CodePen.

https://static.codepen.io/assets/embed/ei.js

Thanks to the following stackoverflow post for the info: https://stackoverflow.com/a/41499555/522859