react路由的基本使用

1.导入路由需要的组件：

import{BrowserRouter as Rourter, Route, Link } from 'react-router-dom'

 

2.使用Router包裹整个组件

3.使用Link组件作为导航菜单

<Link to="/firsr"> 页面一 </Link>

4.使用Router组件配置路由规则和要展示的组件（路由出口）

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

整体如下：

const APP = ()=> (
 <Router>
  <h1>页面一</h1>
//指定路由入口
<Link to="/first"> </Link>
//指定路由出口
</Router path="/fitst" component={First}> </Router>
) 

注意：link里面的to属性相当于一个a链接，router里的path才是路由规则，to需要与path进行匹配。