框架建设实战5——状态机组件

在大部分业务中,状态机处理比较常见,且相当重要。比如电商的订单场景。

状态机:英文叫StateMachine。顾名思义,根据状态进行流程驱动的机器。

状态机的语义比较容易理解。调用示例代码如下:

java 复制代码
builder.externalTransition()

            .from(States.STATE1)

            .to(States.STATE2)

            .on(Events.EVENT1)

            .when(checkCondition())

            .perform(doAction());

其语义解释为:某个状态跳转到下个状态,会通过事件event来触发,并判断满足什么样的条件;若满足,则状态发生变更,并执行一定的动作。

方案实现:

本方案直接采用阿里大佬张建飞(Frank)的方案:状态机说明及实现

组件命名:

当然,框架的组件,无非将上述方案开源的代码 fork一份,自行包装即可 。由于此状态机方案无状态,在此采用util 类型的组件。即可以将之命名为:frame-util-statemachine

相关推荐
IT=>小脑虎14 小时前
2026年 Vue3 零基础小白入门知识点【基础完整版 · 通俗易懂 条理清晰】
前端·vue.js·状态模式
码农水水16 小时前
美团Java后端Java面试被问:Kafka的零拷贝技术和PageCache优化
java·开发语言·后端·缓存·面试·kafka·状态模式
阿珊和她的猫18 小时前
动态加载:提升应用性能与用户体验的关键技术
状态模式·ux
前端不太难19 小时前
Flutter 列表 rebuild 的真正边界在哪里
flutter·状态模式
前端不太难19 小时前
为什么 Debug 模式下 Flutter 列表“看起来很卡”
flutter·状态模式
__万波__19 小时前
二十三种设计模式(二十一)--状态模式
ui·设计模式·状态模式
阿珊和她的猫1 天前
IIFE:JavaScript 中的立即调用函数表达式
开发语言·javascript·状态模式
阿珊和她的猫2 天前
CommonJS:Node.js 的模块化基石
node.js·状态模式
零一科技3 天前
然然管理系统-双前端加持!基于Ant Design Vue 4.x的前端正在开发中
前端·状态模式
前端不太难3 天前
RN 列表状态设计 Checklist
react native·list·状态模式