控制反转重构组件库，实现跨平台逻辑解耦

本文介绍了如何通过控制反转（IoC）思想重构组件库，实现真正意义上的跨平台逻辑解耦：不再依赖条件编译或平台判断，而是定义Toast、Storage、Router等平台无关的抽象接口，由各端提供具体实现并通过工厂模式集中注册与动态组装；启动时一次性注入全局服务上下文，使业务组件仅声明所需能力、完全无需感知底层实现；更进一步支持运行时动态切换、灰度发布和多策略降级——所有变更均收敛于工厂函数，组件零修改、零感知，大幅提升可维护性、可测试性与多端协同效率。

核心是把平台相关逻辑从组件内部剥离，让组件只声明“需要什么能力”，不关心“这个能力在哪实现”。跨平台不是靠条件编译硬切，而是靠统一接口 + 运行时注入 + 工厂组装。

定义平台无关的抽象接口

不要让 Button 组件里写 if (isMiniProgram) wx.showToast() else alert()。先抽离行为契约：

• ToastService：含 show(message: string): Promise
• StorageService：含 get(key: string): Promise 和 set(key: string, value: string): Promise
• RouterService：含 push(path: string, params?: Record): Promise

所有组件只依赖这些接口，不 import 任何平台 SDK。

按平台实现并集中注册工厂

在 platforms/ 目录下分环境提供具体实现：

• h5/toast.ts：用 document.createElement('div') 渲染浮层
• mp-weixin/toast.ts：封装 wx.showToast 并适配 Promise
• mp-alipay/toast.ts：调用 my.showToast

再通过工厂函数收口：

启动时注入，组件内无感使用

在各平台入口文件（如 main.h5.ts、app.js）中一次性组装服务实例：

组件内部直接消费：

支持运行时动态切换与灰度验证

当某平台新版本上线需灰度验证时，无需改组件代码，只需调整工厂逻辑：

• 加一个开关：若 import.meta.env.VITE_TOAST_EXPERIMENT === 'true'，则返回实验版 Toast
• 小程序中可基于用户特征 ID 做分流：userId % 100
• H5 环境下可 fallback 到浏览器原生 Notification，失败再降级为 DOM 浮层

所有策略都集中在工厂函数里，业务组件零感知、零修改。

好了，本文到此结束，带大家了解了《控制反转重构组件库，实现跨平台逻辑解耦》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！