Wizard 分步向导
/WIZ-erd/ · noun · 导航类模式 · #114
把一件长任务拆成固定顺序的几个小步骤，每步一屏：顶部的步骤条显示你在第几步（1 填写信息、2 付款、3 确认），底部是“上一步”和“下一步”。安装设置、结账、注册流程都常用；单独那一排带编号的步骤叫步骤条（stepper）。
别名：步骤条、分步表单。
你可能会这样叫它
- “表单顶部的 1-2-3 步”
- “分成几步填写的表单”
- “结账流程里的步骤条”
- “一步一步的设置向导”
- “注册时的进度步骤”
……它的名字是 分步向导（Wizard）。
代码里叫什么
| Flutter | Stepper Step |
|---|---|
| Angular Material | MatStepper mat-step |
| React (MUI) | Stepper Step StepLabel |
| Web (ARIA) | aria-current="step" |
| iOS / Android | 没有向导组件：用导航栈加顶部进度视图实现 |
复制给 AI 编程工具
把这个长表单改成分步向导：按相关字段拆成 3 到 5 步，顶部的步骤条写出每一步的名称和状态（已完成、当前、未开始）；点“下一步”前先校验本步，点“上一步”时保留已填内容；最后一步是确认页，提交前可以回去修改任何部分。当前步骤用 aria-current="step" 标出，并让网址同步，刷新和浏览器返回键都能正常工作。