Skip to content

Instantly share code, notes, and snippets.

@ghostffcode
Created August 18, 2016 14:38
Show Gist options
  • Save ghostffcode/0c9900d424905e454769d1c335e56fda to your computer and use it in GitHub Desktop.
Save ghostffcode/0c9900d424905e454769d1c335e56fda to your computer and use it in GitHub Desktop.
Simple Explanation Of React this.props.children

Say I have a route for react that looks like below route:

<Route path="/" component={Layout}>
  <IndexRoute component={home}></Route>
  <Route path="user" component={user}></Route>
</Route>

Where the Layout component has just the header and footer only but the main content of the webpage is loaded from the child routes. Home is the index route and /user renders the user route inside the Layout component. To display the content of the home or user component inside the Layout route, you need to include below code in the Layout route:

{this.props.children}

I hope this helps. Cheers.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment