项目的安装与初始化请先查看宿主项目
https://github.com/HammCn/AirPowerDemo
为了满足前端开发标准化、工程化、系统化等等需求,我们设计并开发了一个开发组件库和常用类库和方法库的集合基础脚手架,其中包含了一些页面通用的布局、常用的弹窗和交互、提示信息以及网络请求,强类型面向对象的约束规范等,以满足日常开发的快捷、稳健、标准化等要求。
AirPower目前依赖 Vue
+ TypeScript
+ Element Plus
等组件,其中还包含了一些第三方模块的依赖,具体可以参考项目的 package.json
。
AirPower内置了以下一些模块:
-
包含了常用的
AInput
AButton
ATable
AToolBar
APage
等常用的组件; -
包含了 实体配置、字段在
Table
Search
Form
中的特性配置、Props
传参配置、图像配置等常用的配置类、配置方法等; -
提供了表格配置、表单配置、类和属性自定义名称配置、搜索配置等装饰器;
-
包含了一些分页、排序、常用类、抽象基类等标准的数据传输模型;
-
提供了目前已经达成标准和规范的一些枚举信息,如颜色、日期格式、反馈图标样式、搜索类型、HTTP参数等;
-
基于
Element Plus
提供的标准反馈组件,定义了规范的一些弹窗、确认框、通知信息等反馈组件; -
提供了时间日期、文件、数据转换、弹窗、随机与加解密、路由等快捷操作的助手类和方法;
-
提供了一些常用数据结构的标准化配置以及需要被实现的标准接口;
-
提供一些基础的数据模型与操作方法;
-
提供了一些基础的
CRUD
方法的基础网络请求服务和一些常用的API
; -
提供了错误页等常用的内置页面;
-
为了避免大量重复代码的出现,我们尽可能通过
TypeScript
的装饰器将一些类或属性的配置写入到原型链中,在需要使用这些配置的地方通过反射将保存的参数配置取出使用即可。其中,如果涉及一些默认值,将默认值通过
AirConfig
作为基础配置进行初始化到系统中,通过配置项的使用范围和配置成本进行调整后,使用方可以最小配置的方式进行系统业务的接入和开发。 -
在相同或相似业务中,我们使用标准的强面向对象进行实现,基于继承、封装等特性进行代码的复用,通过泛型、接口等方式将相似的业务逻辑进行标准化约束,实现相似但又不完全相同的一些灵活业务的快速开发。
-
为了在后端因业务要求进行属性调整后前端不需要做大量的查找替换进行修复,我们使用
fromJson()
/fromJsonArray()
/toJson()
/copy()
/recoverBy()
等方法来进行数据的转换,详细请阅读关于数据转换的部分。
-
装饰器是 TypeScript 引入类似
Java注解
的一个编程方式,依赖装饰器,可无侵入式的在业务前后运行其他的业务代码而无需改动原有的业务代码。装饰器的本质就是一个
Function
类、方法、属性、参数等在标记了装饰器后,会执行装饰器的相关方法,然后通过原型链或者反射的方式,对操作的对象进行一些数据的处理或逻辑的限制。 -
@ClassName('用户') //为类标记一个可读的名称 @FieldName('真实姓名') //为属性标记一个可读的名称
当我们需要频繁的修改某些实体的名字,如
AppEntity
从 应用 改为 应用程序,姓名改为真实姓名,我们往往需要去查找替换,所以我们直接标记到对应的AppEntity
类上,其他地方统一从实体中直接获取。 -
可查看
@/airpower/decorator/
目录下提供的所有装饰器 -
待整理
-
AirModel
是AirPower
的模型超类, 实现了json到类
互相转换的一系列方法的一个数据模型基类。 我们建议,所有与后端对接的数据类都必须根继承至AirModel
, 比如数据实体
分页对象
搜索对象
等等。然后你就可以通过AirModel
提供的相关装饰器对指定数据类进行字段转换等操作。 -
AirAbstractEntity
约束子类必须包含ID
字段,请自行实现一个继承 AirAbstractEntity 抽象实体基类的BaseEntity
来进行比选字段的暴露和配置,也可以在BaseEntity
中添加子系统业务相关的其他必须的业务字段。 -
我们在
AirPower
里实现了一个AirAbstractService
服务基类,实现了单表增加
、删除
、修改
、查询分页
、查询数组
等相关基础方法,业务中如无特殊业务需求,无需再次实现单表业务中这些重复的方法,但我们建议:宿主初始化一个继承了AirAbstrtactService
的中间基类BaseService
以应对不符合AirPower规范的场景,你可以在BaseService
中间接口类中重写相关的接口。 -
interface
在面向对象中可作为约束来对业务进行规范,但TypeScript
很多使用者都习惯使用interface
来作为限制对象属性的工具,我们建议:
只在装饰器参数、与第三方库的数据转换场景下使用
interface
作为数据格式的直接限制使用,其他任何场景不使用interface
作为直接限制。