Pass props to routes

src/App.js

@@ -15,12 +15,12 @@ const routes = [
   {
     title: 'Home',
     path: '/',
-    component: Home,
+    comp: Home,
     exact: true
   }, {
     title: 'About',
     path: '/about',
-    component: About
+    comp: About
   }
 ]
 
@@ -42,7 +42,11 @@ class App extends Component {
           </Nav>
           <Switch>
             {routes.map((route, i) => (
-              <Route key={i} {...route} />
+              <Route
+                {...route}
+                key={i}
+                render={() => <route.comp {...route} />}
+              />
             ))}
             <Route component={NoMatch} />
           </Switch>

src/views/Home.js

@@ -4,17 +4,20 @@ import Page from '../components/Page'
 import { Container, Section } from '../components/common'
 import PageHeader from '../components/PageHeader'
 
-export default (props) => (
-  <Page>
-    <PageHeader title={props.title} />
-    <Section thin>
-      <Container>
-        <h1>Welcome.</h1>
-        <p>Hello!</p>
-      </Container>
-    </Section>
-    <Helmet>
-      <title>Home</title>
-    </Helmet>
-  </Page>
-)
+export default (props) => {
+  console.log(props)
+  return (
+    <Page>
+      <PageHeader title={props.title} />
+      <Section thin>
+        <Container>
+          <h1>Welcome.</h1>
+          <p>Hello!</p>
+        </Container>
+      </Section>
+      <Helmet>
+        <title>Home</title>
+      </Helmet>
+    </Page>
+  )
+}