组件化设计方案

247 阅读2分钟

一、组件的结构

Untitled Diagram.drawio.png

业务通用层:

2个或2个以上的一些个别组件需要有的共同的能力。可以拆分出来业务通用层为2个以上的个别组件提供服务。

比如:

  1. 搜索模块,聊天模块与聊天记录模块都有同样的滑动搜索场景,可以对外提供一个滑动搜索组件层,对外提供统一的能力。
  2. 聊天组件、翻译组件有同样的文本解析诉求,可以封装成独立的一个组件,为这两个组件服务。
  3. 对步行、骑行组件有通用的能力,可以单拆除一个服务于这两个组件的组件。 等等~

依赖关系

如图这样的单向依赖关系,不能反向依赖。

二、组件的调用规则

方式

  1. OPENAPI方式
  2. Target-Action
  3. 协议方式

背景:

目前不少项目没有设置组件的调起规则,有些完全用其中之一,或者混用,但没有明确的混用规则。 导致使用起来比较乱、依赖注入使用也比较泛滥~

规范

  1. 组件页面相关的调起使用OPENAPI
  2. 组件非页面功能使用协议方式

三、OPENAPI的内部实现

Untitled Diagram.drawio (1).png

方式

看的方式要从上到下,以及从下到上来看

从业务方角度来看

直接使用组件定义的url和参数即可~

从添加新的组件来看

  1. 注册到组件管理层的哈希表中
  2. 实现协议,内部约定自己的组件url

四、协议调起的内部实现

Untitled Diagram.drawio (3).png

方式

看的方式要从上到下,以及从下到上来看

从业务方角度来看

直接通过组件对外提供的协议,通过统一的组件管理层,来根据协议调用到实际的组件处理对象后,直接调用协议定义的函数方法即可。

从添加新的组件来看

  1. 声明组件对外的protocol
  2. 实现协议,和协议的方法

五、组件层代码

截屏2022-03-07 下午10.42.00.png

截屏2022-03-07 下午10.42.07.png

六、组件形式

打包

  1. cocoapod方式:Pod Lib Create创建组件包
  2. 目前可以非tag形式,后期稳定后再说真正tag打包形式

图片等资源

  1. 单独组件使用的可以放在组件包里面
  2. 图片在组件里面以Assets.xcassets的方式

命名

  1. protocol和实现的类统一命名规则