react Routing Link and Route

route is configured, link using

https://blog.csdn.net/chern1992/article/details/77186118(copy)

Nested routing the Route is generally used, a similar route as a nested vue in rendering, may enter directly through a local fixed route, equivalent to the local switch

// The index.js 
// ... 
the render ((
   <Router History} = {hashHistory> 
    <Route path = "/" = {the App Component}> 
      { / * Note that the two sub-assemblies is nested in the Route in the App the Route /} 
      <Route path = "/ Repos" Component Repos = {} /> 
      <Route path = "/ About" the About Component = {} /> 
    </ Route> 
  </ Router> 
), document.getElementById ( 'app'))

Link is performed whether the route switching jump, the entire page has a single switch, but the path is directed to know a valid route

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

export default React.createClass({
  render() {
    return <Link {...this.props} activeClassName="active"/>
  }
})
// modules/App.js
import NavLink from './NavLink'

// ...

<li><NavLink to="/about">About</NavLink></li>
<li><NavLink to="/repos">Repos</NavLink></li>

 

Guess you like

Origin www.cnblogs.com/dianzan/p/10968463.html