美文网首页
MVVP:一种基于状态的架构模式的设计与实现

MVVP:一种基于状态的架构模式的设计与实现

作者: 陳云峰 | 来源:发表于2021-04-06 15:34 被阅读0次

    1、常见架构模式

    MVC

    MVC 模式的意思是,软件可以分成三个部分。

    image
    • 视图(View):用户界面。
    • 控制器(Controller):业务逻辑
    • 模型(Model):数据保存

    MVP

    MVP 模式将 Controller 改名为 Presenter,同时改变了通信方向。

    image

    1. 各部分之间的通信,都是双向的。

    2. View 与 Model 不发生联系,都通过 Presenter 传递。

    3. View 非常薄,不部署任何业务逻辑,称为"被动视图"(Passive View),即没有任何主动性,而 Presenter 非常厚,所有逻辑都部署在那里。

    MVVM

    MVVM 模式将 Presenter 改名为 ViewModel,基本上与 MVP 模式完全一致。

    image

    唯一的区别是,它采用双向绑定(data-binding):View 的变动,自动反映在 ViewModel,反之亦然。

    2、什么是 MVVP 模式,为什么要用 MVVP

    什么是 MVVP

    MVVP 是 MVP 的升级版本。MVVP 比 MVP 多了一个ViewState状态,MVVP 是一种基于ViewState状态机的新型架构模式。

    为什么要用 MVVP

    为什么要用 MVVP 呢? MVP 和 MVVM 难道不够用吗? 下面来详细解答一下。

    在 MVP 中,View 和 Presenter 是直接交互的,View 的状态变化,都是通过 Presenter 直接改变和传递。 这会有几个问题:

    • View 和 Presenter 的强耦合: View 和 Presenter 直接调用,不相互独立

    • 无法跟踪视图的状态变化。对于视图中发生的不同状态变化,没有可追溯性

    • 可测试性不足,特别是 MVVM,只能通过观察属性的变化来进行测试

    • 多线程环境中可能会有状态冲突的问题

    基于以上的存在的几个问题,让我们在 MVP 架构中引入一个新的概念ViewStateViewState代表视图当前的状态快照。与其在视图模型的不同位置设置不同的输出,不如每次都设置一个新的视图状态。

    ViewState代码实例

    举个例子,ProductListViewController是商品列表的页面,我们定义此页面的ViewStateProductListViewStateViewController视图的变化都是通过 render(state: ProductListViewState) 函数来渲染和变化的,render函数的入参就是ProductListViewState,通过ViewState的变化更新视图,从而实现视图随状态更新而变化。

    
    

    复制代码

    MVVP 新架构图

    MVVP 架构图如下所示:

    image

    通过状态机 ViewState 这一桥梁,能够很好地把 Presenter、Model、ViewController 三者分离开来,实现解耦的目的。这样各自的职责更清晰,分工更明确,具有良好的可测试性。

    3、MVVP 代码实例

    写了一个简单的 Example, 放在 GitHub 上,供大家下载和参考。欢迎大家 star,如果有问题或者更好的建议也可以在 github 上提一下 issue。

    Github 示例代码下载地址: https://github.com/SwiftyKit/MVVP

    相关文章

      网友评论

          本文标题:MVVP:一种基于状态的架构模式的设计与实现

          本文链接:https://www.haomeiwen.com/subject/lnnskltx.html