安装
npm i react-router-dom -S
路由组件
BrowserRouter as Router 浏览器路由 别名 Router
所有的路由内容都应该放在Router里面
HashRouter as Router 哈希路由
NavLink 带active导航
to 导航的地址
to="/"
exact 必须精确匹配
如果被选中默认会有个active的class
Link 导航
to 切换的页面
Router 路由页面
path 对应的地址
component={} 对应的组件
exact 精确匹配
Switch 一次只显示一个路由
<Switch>
<Route />
</Switch>
Redirect 路由跳转
from 从
to 跳转的地址
Prompt 退出提示
message 提示文字
WithRouter
让非路由组件具有 ``路由Props`
import {WithRouter} from 'react-router-dom'
class ToDo{}
export default WithRouter(ToDo)
包装
constructor(props){
props
match.history.location
}
路由的参数
<NavLink to="/produce/123">
<Route path="/produce:id" component={Produce}>
function Produce({match}){match.params.id}
路由组件的props
history
go
goBack() //返回
goForward //前进
push("/") //切换跳转
replace //跳转不留历史记录
location //地址栏信息
pathname //路径
match
params
路由参数
url //配置的地址
