import React from 'react';

import ReactDOM from 'react-dom'

import {Link,Route,HashRouter} from 'react-router-dom'

export default class App extends React.Component {

  render(){

    return(

      <HashRouter>

        <div>

          <Link to="/">主页</Link>

          <Link to="/one">第一页</Link>

          <Link to="/two/value">第二页</Link>

          <Route exact path="/" render={()=>(

              <h2>主页</h2>

          )}/>

          <Route exact path="/:one" render={({match})=>{

            // render默认注入一个对象，有三个字段，history,location,match

              return(

                <h2>{match.params.one}</h2>

              )

          }}/>

          <Route path="/two/:value" render={({match})=>{

              return(

                <h2>{match.params.value}</h2>

              )

          }}/>

        </div>

      </HashRouter>

    )

  }

}

ReactDOM.render(<App/>,document.getElementById("app"))