ant-design-pro是基于ant-design的一个企业级中后台前端/设计解决方案，有点类似于vue的vue-admin-element，对于我这种一直用vue写项目的react小白非常容易上手，把自己的踩坑记录分享一下。
一、ant-desgin-pro的安装
首先放上ant-design-pro的官网地址，安装按照官网上的步骤就好了，但是有几个需要注意的问题。
1、运行命令用git bash
不然就是一顿操作猛如虎，定睛一看原地杵，因为官网推荐的指令需要从GitHub拉取代码，所以用powershell和命令行工具都不行
2、关于版本和ts
umi推荐两个版本的ant-design-pro，一个是V4一个是V5版本，V5版本是不支持js的只有ts，所以如果准备用js来开发，请选择V4版本
3、src下文件夹的介绍
assets # 本地静态资源
components # 业务通用组件、
e2e # 集成测试用例
layouts # 通用布局
models # 全局 dva model，主要是dva状态管理的一些
pages # 业务页面入口和常用模板，大部分的页面都在这儿写
services # 后台接口服务，分模块封装的接口基本都在
utils # 工具库，封装的工具库
locales # 国际化资源
global.less # 全局样式
global.ts # 全局 JS
二、去掉 layout 上的 logo 和 title.
1、defaultSetting.js上找到title这个属性
2、在ProLayout下找到basicLayout.jsx,logo设置成null
三、关于ant-design-pro自带的三个封装组件
ant-design-pro有三个自带的组件，在两个文档上都没有详细的描述，让人看着就很懵，下面的文档是这三个组件的官方文档，相关参数配置都在这个文档上，procomponents.ant.design/
1、ProDescriptions，没用过
是为了解决项目中需要写很多详情页的样板代码的问题，所以在其中做了封装了很多常用的逻辑。
2、ProTable，基本都会用到
ProTable 默认封装了请求网络，翻页，搜索和筛选的逻辑，就很方便
页码和条数必须用pageSize 和 current，有点麻烦，当然也可以做转换一下
请求过来的数据也有要求
data: Datum[];
success: boolean;
total: number;
3、ProLayout,想不用都不行
Layout 作为协助进行页面级整体布局工具，在每个项目中都必不可少，而且在中后台中是非常雷同的。
直接可以把footer给去掉，毕竟谁也不用阿里的介绍
动态路由建议menuDataRender，里面进行配置
四、请求封装和代理解决跨域
1、umi-request
我们在vue项目里基本都是用的axios，然后进行二次封装进行请求的拦截和配置，ant-design-pro为我们提供了umi-request
2、路由文件
config文件里，有个config.js,路由相关的写在这个文件里
3、proxy代理
config文件里，有个proxy.js，也是一样的配置反向代理
'/bjpt/': {
target: 'http://192.168.3.250:9001',
changeOrigin: true,
pathRewrite: {
'^': '',
},
},
微信公众号里还有很多关于vue的文章，敬请关注
