前言
作者本人主要是从事JAVA后台开发,Vue和React开发因为项目开发实际需要,略懂一二,文章之中如有不当之处,请指正。
成文原因
因为公司一个React项目需要用Ant Design 进行开发,公司没有专门的前端开发,本人只能赶鸭子上架,仓促上阵。
项目做了一段时间,基本进入尾声了,在项目开发期间,发现Ant Design的技术资料尤其是最新的Ant Design Pro V5的资料非常少,官方的帮助文档虽然很全,但是在实际项目开发中很多细节找帮助文档很难定位解决问题,而且我们的项目使用的JavaScript,不是现在React项目用的最多的TypeScript,文档资料更是少之又少。因此萌生了项目做完以后,整理一份Ant Design Pro V5的开发文档。
技术栈
前台:
JAVAScript+React+React Hook+Request(umi)
未使用Dva,做过Vue开发,感觉用Dva的model,Service,Connect特别繁琐,代码也比较晦涩难懂,Dva很多数据通过state传递,组件中要使用state数据时,经常要多个文件切换,确定这个state数据到底是来自哪里?拿后台数据出错时也要多个文件做调试,定位错误,头痛的很,(前台开发一大半的错误都是调用后台接口的参数或者返回数据有问题)而用Ajax或者Vue的axios,都是一个请求直接拿数据做处理。
Ant Design Pro V5中的Umi Request用起来就跟Vue的axios差不多,请求到数据就可以直接处理,不用象Dva一样绕圈子,先Model,再Service,再Connect组件后调用。Umi Request可以参考https://beta-pro.ant.design/docs/request-cn
后台
Spring Boot+若依3.7.0,后台基本直接用若依,有很小一部分代码。若依可以参考https://ruoyi.vip/,用的若依的前后台分离板的后台。
说明
文章中主要以实操为主,不会涉及具体技术点的讲解,具体的React、Javascrip以及SpringBoot相关知识点请自行网上搜寻相关资料。