githubEdit

Passing Props Down To React-Router Route

When using react-routerarrow-up-right, you'll often use the component prop to have a certain component rendered.

<Route
  path="/my/path"
  component={MyComponent}
/>

If, however, you need to pass props down into MyComponent, then you'll want to use the render prop with an inline function.

<Route
  path="/my/path"
  render={(routeProps) => (
    <MyComponent {...routeProps} {...props} />
  )}
/>

The two spread operator statements are essential. They will pass down the route propsarrow-up-right that Route would have passed down plus the additional set of props that you want to pass down.

Last updated