Pass a Component as a Child Prop and Render it – ReactJs

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

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s