react-router 4.0(二)传参

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"))

猜你喜欢

转载自www.cnblogs.com/BlogRegisterboby/p/9288029.html