Skip to content

Instantly share code, notes, and snippets.

Last active October 15, 2019 23:53
What would you like to do?
let routes = (
<RankedSwitch> picks the best child <Route> that matches
the path. Like <Switch>, it does not match deeply, so you
need to use /* on the path if you want to do that. Like
@reach/router's <Router>, it ranks the paths so you don't
have to think about ordering.
Con: You have to use /* to do deep matching
Pro: You don't have to put all your <Route>s in the same
owner, just need to use a `path` prop on children (huge IMO)
<Route path="courses/*">
Layout components render their children, which may be a
<RankedSwitch> if you want to do another level of matching.
Con: ???
Pro: Build your layouts naturally, using children
Pro: No need for <Outlet>
<Route path="react-fundamentals">
<ReactFundamentalsCourse />
<Route path=":course">
<Course />
<Route path="courses/new">
<NewCourse />
<Route path="support">
<Support />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment