The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

React Router: Nested Routes

React Router: Nested Routes

2:08
Since react-router routes are components, creating nested routes is as simple as making one route a child of another in JSX. In this lesson we'll explore nesting routes and accessing the children of parent routes.
Watch this lesson now
Avatar
egghead.io

Since react-router routes are components, creating nested routes is as simple as making one route a child of another in JSX. In this lesson we'll explore nesting routes and accessing the children of parent routes.

Avatar
Erik

Thank you for these great videos.

The Home component render method contains {props.children}, but when the / route is rendered, {props.children} is not rendered. (I.e., we only see 'Home' and the Links. As we see next, {props.children} is rendered when the /about route is requested.

My question is: when/where is the decision being made to render {props.children} in this demo?

In reply to egghead.io
Avatar
Joseph

{props.children} is rendered based on it's presence. At / there is no {props.children} as dictated by the routing, at /about the About component is {props/children} of Home, and at /about/contact the Contact component is {props/children} of About

In reply to Erik
HEY, QUICK QUESTION!
Joel's Head
Why are we asking?