什么是状态图？
状态图，也称为状态机图，可视化对象或系统可能处于的不同状态以及如何响应事件在状态之间转换。它们对于建模生命周期行为、工作流和复杂条件逻辑至关重要。每个状态代表一个稳定的条件，而转换显示导致状态变化的触发器。
编辑与预览
使用 Mermaid 语法创建 状态图，实时查看效果。
100%
常见使用场景
应用状态管理
建模 UI 状态、表单验证流程和应用程序模式。对于在 React 或 Vue 等前端框架中设计状态机至关重要。
工作流建模
设计审批工作流、订单处理状态和工单生命周期管理。为业务流程映射状态转换和守卫条件。
协议设计
可视化网络协议状态、连接生命周期和通信状态机。对于嵌入式系统和物联网设备编程至关重要。
游戏开发
建模角色状态、游戏模式和关卡进度。为 AI 行为和游戏机制设计有限状态机。
核心功能
状态类型
支持简单状态、复合状态以及初始、最终和选择伪状态等特殊状态。
转换守卫
使用守卫条件和在状态变化期间执行的操作定义条件转换。
嵌套状态
创建具有父状态和子状态的分层状态机，用于建模复杂行为。
并发状态
为具有并发行为的系统建模并行状态机和正交区域。
最佳实践
从简单开始
从高级状态开始，逐步细化。使用复合状态在需要之前隐藏复杂性。
将状态命名为条件
使用形容词或过去分词（例如「活动」、「暂停」、「已完成」）而不是动词。
记录转换
用事件、守卫条件和操作标记所有转换。每个箭头都应该讲述一个清晰的故事。
避免状态爆炸
如果有太多状态，寻找模式来组合它们或使用状态变量。