4.0之前,RR还是RR,history属性还具有hashhistory,browserhistory,memoryhistory; 如:
import {Router,Route,hashHistory} from "React-Router";
<Router history={hashHistory}>
<Route />
</Router>
4.0之后,React-Router分解为react-router,react-router-dom,react-router-native,react-router-redux,react-router-config这几部分组成,基本常用的主要是前两者,其中react-router不具备history三个属性,而react-router-dom则拥有react-router,还具有一系列封装好的组件,其中:
<BrowserRouter>=<Router history={browserHistory}>
<HashRouter>=<Router history={hashHistory}>
<MemoryRouter>=<Router history={memoryHistory}>
ps:本文讨论的是第一种, 其余两种用法基本一致。
一)BrowserRouter组件:
4.0之前:<Router history={browserHistory} />
4.0之后:<BrowserRouter />
作用:以URL中pathName的值(相对路径)作为路由跳转的触发点;
语法:<BrowserRouter basename getUserConfirmation KeyLength>
children
</BrowserRouter>
参数解释:
children:子元素,只能存在一个;
basename:字符串,设置基准路 径,路由跳转都是基于该路径下跳转;
eg:
<BrowserRouter basename="/A">
<Route path="/B" />
</BrowserRouter>
实际是跳转到了/A/B
getUserComfirmation:函数,跳转到某个页面时所执行的函数;
KeyLength:数字,设置Location.Key的长度;
(后续)