1：路由分为前端路由和后端路由
后端路由用来处理用户提交的请求，当node接受到一个请求的时候，根据请求路径找到匹配的路由，调用路由中的函数来处理请求，然后然后响应数据
前端路由：用来展示页面内容
2：简单准备工作
下载react-router-dom：npm i --save react--router-dom
引入bootstrap.css 样式
确认导航区和显示区，导航区的a 需要写为Link标签 展示区写Router标签进行路由匹配，App标签外面需要包裹 BrowserRouter 或者HashRouter 标签
3：路由切换显示过程：
（1）在index.js中 引入 BrowserRouter路由，把app进行包裹
（2）在components创建两个组件 然后再这里面分别 从react中引入Component 然后export导出 div 需要显示内容
（3）然后再app中引入这两个组件 ，并且再react-router-dom中引入Link{形成标签}，和Router{呈现组件}
（4）然后在render中return出去Link 用来匹配地址 br下面 用来进行路由匹配显示组件Router
这样就可以点击然后有不同的页面了。
4：NavLink 和Link区别：
用NavLink点击的时候会自动带class：active这个类，也可以在NavLink标签进行修改用activeClassName=“自定义类”
5：对NavLink 进行封装，
在component中创建MyNavLink 然后再这其中从react引入Component 从react-router-dom中引入Navlink。
然后在export导出MyNavLink render里面return出去NavLink标签。
这时在app.js里面br上面就可以不用写NavLink标签，直接在上方import封装的 ，然后写上等装好的名做标签就可以了 。
6：NavLink 传值
log输出发现NavLink标签中有props 值有to 和childer
所以我可以在NavLink标签中 把{...this.props}扔进去 这样就使得NavLink标签有了to 和childer属性
childer携带得数据就是使用标签使写得文字
to就是标签使用得地址
7：Switch得使用
一般path和component是一种对应关系，当用了switch之后就匹配路径就可以了，不用在往下写了
一般解决问题：就是当我创建了两个组件得时候，我用了path给他们俩匹配一样得路径，但是组件匹配不一样，当我点击这个路径得时候就会出现两个组件显示内容。（没用）
（1）在react-router-dom中引入switch
然后把br下面显示得router展示 用switch标签包裹 这样当我点击时就不会出现两个组件得内容。而是进行对应显示。
8：标签加上exact为精确匹配