學習react-router-dom路由

import 
{HashRouter,//路徑有個#開頭部署到開發環境不友善url顯示
Route,//用于比對路徑渲染元件
Link,//路由導航
Switch,//比對第一個符合規則的路由，進行元件渲染 如果沒有就redirect
withRouter,//隻有路由跳轉的元件props屬性才包含路由資訊 這個是withRouter(元件)
//強行把location，history，match注入元件props資訊
NavLink//,高亮路由導航 a标簽的僞類一樣
BrowserRouter,//路徑沒有#美觀用于部署項目時候使用 建議使用這個
Prompt,//離開路由界面的提示 不是兩個嵌套路由切換 而是兩個完全不同的路由切換
Redirec//t重定向不保留路徑
} from 'react-router-dom'
           

route路由比對從上至下

<Route exact path="/" component={Pa}></Route>
<Route exact path="/a"component={We} />
           

exact表示精确比對 比如 /a 比對 /a 不會比對/a/b

一定注意前面不要在嵌套路由的時候在一級路由裡面加exact

因為exact比對一級路由字首 後面的二級路由比對不到

要加也是加在後一級路由上面

路由的使用很靈活 你可以在初始化的時候挂載渲染使用

也可以在元件裡面 使用