Browse Source

L12 Navigating.

Frederic G. MARAND 8 years ago
parent
commit
c5ae09b0e4
1 changed files with 31 additions and 8 deletions
  1. 31 8
      modules/Repos.js

+ 31 - 8
modules/Repos.js

@@ -2,14 +2,37 @@ import React from "react";
 import NavLink from "./NavLink";
 
 export default React.createClass({
+  contextTypes: {
+    router: React.PropTypes.object
+  },
+
+  handleSubmit(event) {
+    event.preventDefault();
+    const userName = event.target.elements[0].value;
+    const repo = event.target.elements[1].value;
+    const path = `/repos/${userName}/${repo}`;
+    console.log("Path:", path);
+    this.context.router.push(path);
+  },
+
   render() {
-    return <div>
-      <h2>Repos</h2>
-      <ul>
-        <li><NavLink to="/repos/reactjs/react-router">React router</NavLink></li>
-        <li><NavLink to="/repos/facebook/react">React</NavLink></li>
-      </ul>
-      {this.props.children}
-    </div>;
+    return (
+      <div>
+        <h2>Repos</h2>
+        <ul>
+          <li><NavLink to="/repos/reactjs/react-router">React router</NavLink></li>
+          <li><NavLink to="/repos/facebook/react">React</NavLink></li>
+          <li>
+            <form onSubmit={this.handleSubmit}>
+              <input type="text" placeholder="userName" /> / {' '}
+              <input type="text" placeholder="repo" /> {' '}
+              <button type="submit">Go</button>
+            </form>
+          </li>
+        </ul>
+        {this.props.children}
+      </div>
+
+    );
   }
 });