added params example

Author: taytestokes

README.md

@@ -196,4 +196,4 @@ const {id} = props.match.params;
 
 or if we console logged `props`, the object would look like the following
 
-![props object](images/props)
+![props object](images/props.png)

src/App.js

@@ -8,6 +8,7 @@ import Home from './components/Home';
 import About from './components/About';
 import Contact from './components/Contact';
 import Navbar from './components/Navbar';
+import Profile from './components/Profile';
 
 class App extends Component {
   render() {
@@ -18,6 +19,7 @@ class App extends Component {
           <Route exact path='/' component={Home} />
           <Route path='/about' component={About} />
           <Route path='/contact' component={Contact} />
+          <Route path='/profile/:user_id' component={Profile} />
         </Switch>    
       </div>
     )

src/components/Navbar.js

@@ -31,6 +31,10 @@ const Navbar = () => (
         <Link to="/contact" style={linkStyle}>
             <span>Contact</span>        
         </Link>
+        {/* this will link to the profile for user with id of 1 */}
+        <Link to="/profile/1" style={linkStyle}>
+            <span>Profile</span>        
+        </Link>
     </nav>
 )
 

src/components/Profile.js

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Profile = (props) => {
+    // take the id from props
+    const {user_id} = props.match.params;
+    return <h1>This is the user profile for the user with the id of {user_id}</h1>
+};
+
+export default Profile;