React Router v4
React Router V4 遵循了 React 的理念：萬(wàn)物皆組件铐伴。不用于Vue里的Router-view嵌套
1.坑1
1.只需要引入react-router-dom
1.<BrowserRouter>：使用 HTML5 提供的 history API 來(lái)保持 UI 和 URL 的同步；
2.<HashRouter>：使用 URL 的 hash (例如：window.location.hash) 來(lái)保持 UI 和 URL 的同步瓦糕；
import {BrowserRouter as Router} from 'react-router-dom'
2.坑2Router下面只能有一個(gè)子組件
//需要一個(gè)Fragment來(lái)進(jìn)行包裹等操作
<Router>
<div>
<Route exact path="/" component={Home}/>
<Route path="/list" component={Me}/>
</div>
</Router>
1.path（string）: 路由匹配路徑喂柒。（沒有path屬性的Route 總是會(huì) 匹配）辣卒；
2.exact（bool）：為true時(shí)拧晕，則要求路徑與location.pathname必須完全匹配，將我們的路由變成排查性路由蜒茄；
3.strict（bool）：true的時(shí)候唉擂，有結(jié)尾斜線的路徑只能匹配有斜線的location.pathname；
import { withRouter } from 'react-router-dom'
//.......
export default withRouter(Onelist))
一.props.params
//定義路由
<Route path='/user/:name' component={Detail}></Route>
//跳轉(zhuǎn)
<div key={index} className="zimg"
onClick={_el => this.props.history.push( { pathname:'/detail/1', })}>
//接受
this.props.match.params.name
二.query
//定義
<Route path="/detail" component={Detail} />
//跳轉(zhuǎn)
<div key={index} className="zimg"
onClick={_el => this.props.history.push(
{pathname:'/detail',
query:1,
})}>
//接收
this.props.location.query
路由在線文檔：https://reacttraining.com/react-router/web/guides/quick-start
