如何用 Mermaid 画需求图

2026-03-05 · MermZen 教程

需求图用于可视化项目需求、需求之间的关系和验证方法，适合需求管理、项目规划、软件开发生命周期管理等场景。Mermaid 使用 requirementDiagram 关键字声明需求图。

声明图表

使用 requirementDiagram 关键字：

requirementDiagram
    title 需求图标题

在 MermZen 中试试 →

需求定义

创建需求节点：

requirementDiagram
    title 基本需求图
    requirement "需求 1" {
        id: R1
        text: 用户可以登录系统
        type: functional
        status: approved
    }
    requirement "需求 2" {
        id: R2
        text: 用户可以查看个人信息
        type: functional
        status: pending
    }
    requirement "需求 3" {
        id: R3
        text: 系统应该具有响应式设计
        type: non-functional
        status: approved
    }

在 MermZen 中试试 →

需求关系

定义需求之间的关系：

requirementDiagram
    title 需求关系图
    requirement "登录功能" {
        id: R1
        text: 用户可以登录系统
    }
    requirement "个人信息管理" {
        id: R2
        text: 用户可以查看和编辑个人信息
    }
    requirement "响应式设计" {
        id: R3
        text: 系统在各种设备上都应该正常显示
    }

    "登录功能" --> "个人信息管理" : requires
    "登录功能" --> "响应式设计" : requires
    "个人信息管理" --> "响应式设计" : requires

在 MermZen 中试试 →

完整示例：软件项目需求管理

requirementDiagram
    title 电商系统需求图
    requirement "用户管理" {
        id: R1
        text: 用户可以注册、登录、修改个人信息
        type: functional
        status: approved
        priority: high
        verification: "用户测试"
    }
    requirement "产品展示" {
        id: R2
        text: 系统可以展示产品列表、详情和分类
        type: functional
        status: approved
        priority: high
        verification: "自动化测试"
    }
    requirement "购物车" {
        id: R3
        text: 用户可以添加、删除、修改购物车商品
        type: functional
        status: pending
        priority: medium
        verification: "手动测试"
    }
    requirement "支付功能" {
        id: R4
        text: 支持多种支付方式（支付宝、微信、信用卡）
        type: functional
        status: approved
        priority: high
        verification: "集成测试"
    }
    requirement "性能要求" {
        id: R5
        text: 系统响应时间应小于 2 秒
        type: non-functional
        status: approved
        priority: medium
        verification: "性能测试"
    }

    "用户管理" --> "产品展示" : requires
    "用户管理" --> "购物车" : requires
    "产品展示" --> "购物车" : requires
    "购物车" --> "支付功能" : requires
    "用户管理" --> "性能要求" : impacts
    "产品展示" --> "性能要求" : impacts
    "购物车" --> "性能要求" : impacts
    "支付功能" --> "性能要求" : impacts

在 MermZen 中试试 →

速查表

语法	功能
`requirementDiagram`	声明需求图
`title 标题`	设置图表标题
`requirement "名称" { ... }`	定义需求
`id: 标识符`	设置需求唯一标识符
`text: 描述`	设置需求描述文本
`type: 类型`	设置需求类型（functional/non-functional）
`status: 状态`	设置需求状态（approved/pending/rejected）
`priority: 优先级`	设置需求优先级（high/medium/low）
`verification: 方法`	设置验证方法
`"需求 1" --> "需求 2" : 关系`	定义需求之间的关系
`%% 注释`	行注释

下一步

掌握需求图后，您可以继续学习其他 Mermaid 图表类型，或查看我们的 Mermaid 图表速查表获取完整的语法参考。

如果您想在 MermZen 中尝试上述代码，可以点击在线编辑器，然后将代码粘贴进去。