react-router的基本使用及redux的串联使用（路由守卫）

本文仅针对reactRouter及redux的简单串联使用
提示：react-router的安装命令为

npm install --save react-router-dom

1. 在页面中对route的引用

一般用到的route的API 就上面引用到的，具体的使用 查看文档https://reacttraining.com/react-router/web/guides/quick-start

2. 页面构造如下
   
   此次中我们使用到的是

 <PrivateRoute path='/about' component={About} />
 <Route path='/login' component={Login} />

3. 创建About组件
   此处可以自行设计简单显示的组件即可 我这里有些功能上的使用

4. 创建PrivateRoute组件对路由拦截进行权限判断
   此处PrivateRoute 作为一个高阶组件，接收一个基本组件 返回一个新组件，将需要用到的参数都从传入的参数中解析出来，然后做一个是否登录了的权限判断
   

5. 创建Login可以做登录时间且判断是否登录了，如果已登录跳转到要跳转的组件
   

6. 在PrivateRoute和Login组件里有些参数和事件在实际项目中，都是储存在redux中
   创建userRedux
   

7. 在将这个redux接进项目
   因为是简单列子 直接将所有的redux都接到store/index.js中
   然后再将这个index接入app.js中
   
   

8. 在页面中连接到redux，用到connect,所以要对之前写好的两个组件进行改造
   对于connect的使用

connect(redux中的state，redux中的方法)(组件)

对于Login组件的修改
要使用redux中的方法 要进行引用

9. 文件夹层级结构：
   因为是简单列子，层级结构不标准，只是做个说明
   
10. 显示效果