Skip to content
This repository was archived by the owner on Jul 19, 2019. It is now read-only.

Latest commit

 

History

History
36 lines (29 loc) · 807 Bytes

File metadata and controls

36 lines (29 loc) · 807 Bytes

Navigating with Link

Perhaps the most used component in your app is Link. It's almost identical to the <a/> tag you're used to except that it's aware of the Router it was rendered in.

Let's create some navigation in our App component.

// modules/App.js
import React from 'react'
import { Link } from 'react-router'

export default React.createClass({
  render() {
    return (
      <div>
        <h1>React Router Tutorial</h1>
        <nav>
          <ul>
            <li><Link to="/about">About</Link></li>
            <li><Link to="/repos">Repos</Link></li>
          </ul>
        </nav>
      </div>
    )
  }
})

Now visit http://localhost:8080 and click the links, click back, click forward. It works!


Next: Nested Routes