以ant design pro示例框架为基础的前端开发小结

如上图，为ant design pro基本机构，最外层还有一个重要文件.roadhogrc.mock.js。

在该框架中，执行的基本逻辑如下：

先搭建路由，src/common下有menu和router两个文件，先在menu里写入预备在slider里边展示的路径，然后在router里进行配置，将路由和文件的路径相匹配，并连接该页面的model（models文件夹下的文件，页面需要的）
在src/routes下新建文件夹（eg:Temp）,可以在下边分别见index.js和index.less
在src/components下写各页面公共组件。
在src/models中建立页面所需model，最好名称对应（eg:temp）,该文件用来连接页面和services，主要内容是action（该页面调用了service的func）
在src/services/api中配置页面进行前后台数据请求的路径并调用src/utils/request文件中fetch方法向后台发送请求
.roadhogrc.mock.js用于配置请求的url使前后台链接起来
在若用mock数据，在mock文件中写好并导出，如原文件，
 

或者 ‘GET /api/users' : getUser（mock文件导出的内容） 
当与后台联调时，改：‘GET /api/users' : { users : [ 1 , 2] }  为  'GET /api/users' : http://服务器id:端口号（eg: http://127.0.0.1:8080/）
            错！！！！ 
'GET /api/users' :  http://127.0.0.1:8080/api/users     7.最后，可以在theme文件中改主体及各个基础设置，颜色，宽高，大小等；其他的theme不能改的样式，可以加类名或者找组件渲染之后的类名，在src的index.less中改