安装
npm i react-router-dom -S
导入路由需要的组件
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
【常用路由组件如下:】
BrowserRouter as Router
浏览器路由 别名为Router
Link导航 to切换的页面
Route路由页面--path对应链接component对应组件
BrowserLink
带active激活的class路由连接
子路由
步骤01:导入NavLink
import {BrowserRouter as Router,Route,Link,NavLink} from 'react-router-dom'
步骤02:定义指令NavLink
<NavLink to="/detail">详情</NavLink>
步骤03:定义主路由
<Route path="/detail" component={Detail}></Route>
步骤04:编写主路由
child组件
life生命周期
Todolist
导出 child Todo
}
路由组件的参数
history
goBack() 返回
goForward() 前进
push('/') 切换跳转
replace 跳转不留历史记录
location 地址栏信息
pathname路径
match
params路由参数
url 配置的地址