4,297
// 项目简介
Westore 是一套专为小程序设计的 MVVM 分层架构,旨在通过职责驱动设计将业务逻辑与视图层彻底解耦。该框架通过引入 Store 层作为中介,实现了 Model 的高度可移植性与代码复用。开发者无需直接操作 setData,仅需调用 update 方法即可通过内部 diff 机制实现高效的视图更新。
// 技术分析
Westore 是一款专为微信小程序设计的 MVVM 分层架构框架,旨在解决小程序业务逻辑堆积在 Page/Component 中导致的难以维护和扩展的问题。它通过引入职责驱动设计(Responsibility-Driven Design),强制开发者将业务逻辑封装在独立的 Model 层中,从而实现业务逻辑与视图层的完全解耦。该架构采用中介者模式,通过 Store 层桥接 View 和 Model,不仅提升了代码的可测试性,还实现了 Model 层的跨平台复用,使开发者能够将核心业务逻辑无缝迁移至 Web 或其他渲染环境。
// 核心亮点
01
强制执行面向对象编程,通过职责驱动设计提升代码的结构化与模块化水平。
02
实现业务逻辑与视图层解耦,Model 层代码可 100% 移植至 Web、小游戏等其他环境。
03
采用被动视图(Passive View)设计,确保视图层仅负责展示,不包含任何业务逻辑。
04
内置 deepClone 与 dataDiff 机制,自动计算最短更新路径,无需手动调用繁琐的 setData。
05
通过中介者模式简化 View 与 Model 之间的交互,有效降低系统复杂度并提升可维护性。
06
支持通过模拟对象注入进行单元测试,显著增强了复杂业务场景下的代码健壮性。
// 典型使用场景
01
实现业务逻辑与视图层的解耦,提升代码的可维护性与扩展性
02
通过面向对象设计实现 Model 层在不同平台间的 100% 代码复用
03
利用内部 diff 算法自动计算最短路径更新视图,简化开发流程
// 快速开始
开发者可通过 npm install westore --save 命令将框架集成到小程序项目中。安装后,建议参考官方提供的 westore-example 或 westore-example-ts 示例代码,按照 Model-Store-Page 的分层结构组织业务逻辑,并通过继承 Store 类来管理页面数据与交互。