Skip to content

Instantly share code, notes, and snippets.

@michaelrambeau
Created April 13, 2017 07:53
Show Gist options
  • Save michaelrambeau/e6415846634275a675e78ad3861046ca to your computer and use it in GitHub Desktop.
Save michaelrambeau/e6415846634275a675e78ad3861046ca to your computer and use it in GitHub Desktop.
React Router v4
import React from 'react'
import Home from './Home'
import Header from './Header'
import ProjectList from './ProjectList'
import ProjectItem from './ProjectItem'
import { Route, Switch } from 'react-router-dom'
const NoMatch = () => (<div>No match!</div>)
const ProjectItemReadme = () => (<div>This is a wonderfull project!</div>)
const ProjectItemReviews = () => (<div>Here are the reviews</div>)
const ProjectItemLinks = () => (<div>Here are the links</div>)
const Routes = () => (
<div>
<Route component={Header} />
<Switch>
<Route exact path="/" component={Home} />
<Route exact path="/projects" component={ProjectList} />
<Route path="/projects/:id">
<div>
<Route component={ProjectItem} />
<Route path="/projects/:id/readme" component={ProjectItemReadme} />
<Route path="/projects/:id/reviews" component={ProjectItemReviews} />
<Route path="/projects/:id/links" component={ProjectItemLinks} />
</div>
</Route>
<Route component={NoMatch} />
</Switch>
</div>
)
export default Routes
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment