之前没有接触过react。新工作需要用react框架，另外配合ant design ui框架来实现一个后台管理系统的编写，上周学习了它提供的各个组件并试着去编写了一些页面，大致有了了解。‘

鉴于网上没有很好的文章很好的讲解一下这个框架，同时也是自己对最近的一个总结。

前期的克隆工程以及npm start就略过了,还有各个文件夹的用途就不用说了，资料有得.我主要想说一下新添加一个页面并从服务端获得数据进行渲染

1、添加一个路由

首先在src/common/menu.js里面添加一个数据配置，结果如下,  

另外在menu.js中添加一个路由

配置路由

，这样页面中就会出现一个效果

2. 在指定文件夹下新建一个组件，这样route就可以进行访问了

根据上图的路由指向../routes/group/student/mine，我需要在/routes/group/student/ 中新建一个mine.js文件。可以先写一个简单的页面（没有任何数据来源这是一个展示hello world之类的，再次略过）,展示我的代码

稍微讲解一下吧看下面 链接了一个mine model，因为 这里声明了一下是在mine model层里面的 connect之后this.props就会添加一个dispatch属性，这里就可以进行请求了 这里的是在请求完毕后就会返回一个mined对象，里面有一个对象叫做mineData属相值，当然这个名字是自定义的，你也可以写你定义的不过后面返回数据的时候也要相应进行更改，切记切记切记

3 编写model层

因为用到了mine这个model,所以在src/models文件夹下新建一个mine.je进行事件的管理，派发以及返回

具体暂时还没天明白这里面各个函数的意思，大致意思明白的，namespace命名空间，state是所有的状态数据，effect是事件的一个派发接收，reduce是返回一个想要的数据格式，这里面用到了一个getMIneData是在另一个页面中用到的，同样的在相应文件夹下service新建一个mine.js

4 service层

这里返回一个函数，并且函数里面就行了请求并写了请求接口这样就可以在.roadhogrc.mock.js里面进行编写一个假数据

5 数据

接口请求 这里运用的一个组件 返回数据

6 验证数据

在这里进行一个数据的打印 在控制台里面看到了数据 页面中也看到了效果

至此，就有了一个大致的了解