react-router-domV5学习记录

官方文档 https://reacttraining.com/react-router/web/guides/quick-start

中文文档 https://react-router.docschina.org/web/example/basic

目录

1.路由基本使用

2.路由嵌套

---

1.路由基本使用

1.下载 yarn add react-router-dom@5.2.0

2.  引入 import { BrowserRouter as Router, Route, Link } from 'react-router-dom'

3.使用Router组件 包裹要使用的路由语法(重要)

<Router>

        <Link to='/first'></Link>

        <Route path="/first" component={First}></Route>

</Router>

4.使用Link组件作为导航菜单(路由入口)

<Link to='/first'></Link>

5.使用Route组件配置路由规则和要展示的组件(出口)

//path为上面Link路径地址   //component为展示哪一个组件

<Route path="/first" component={First}></Route>

2.路由嵌套