mastergo ai 通过设计系统约束、容器语义识别与可编辑画布机制，从生成源头控制结构合理性。它复用已有组件库并自动组织于语义容器中，输出默认即容器化，支持矢量编辑与mcp上下文感知，实现层级主动干预。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
MasterGo AI 解决层级混淆问题，核心不是“事后清理”，而是从生成源头控制结构合理性。它通过设计系统约束、容器语义识别与可编辑画布机制，把原本容易失控的嵌套结构，变成可预期、可干预的分层体系。
用设计系统锚定结构层级
MasterGo AI 不是泛泛地“画出页面”，而是深度感知你团队已有的设计系统（如 Ant Design、Element Plus 或自定义组件库）。当输入“生成用户列表页”时，AI 会优先复用已有 List、Card、Avatar 等原子组件，并自动将它们组织在语义明确的容器中（例如 ListView Frame 下直接放置 ListItem Group，而非层层嵌套 div 容器）。这种基于组件库的生成逻辑，天然规避了 HTML 转换中因 Flex/Grid 布局映射导致的“俄罗斯套娃”式嵌套。
生成即容器化，杜绝孤立图层
AI 快搭输出的每一处 UI 元素，默认都处于合理容器层级中：
- 标题区域 → 自动放入带 Auto Layout 的 Header Frame
- 表单字段 → 批量生成在 Form Container 内，支持统一间距与对齐
- 操作按钮组 → 生成为独立 ButtonGroup Frame，而非散落在画布上的多个按钮图层
这意味着从第一秒开始，就符合 MasterGo 的连接规则：所有交互元素天然具备容器权限，不会出现“按钮失联”或“连接线变红”等新手高频问题。
menu.js是一款Material Design风格的jquery下拉菜单插件。通过menu.js插件，你可以非常轻松的制作出Material Design风格的下拉菜单或下拉列表。 使用方法 在页面中引入样式文件menu.css和jquery.min.js、menu.js文件。
矢量可编辑画布，支持结构主动干预
生成结果不是静态图片或不可拆解的组合体，而是完全可编辑的矢量图层树：
- 双击任意区域，可逐层展开查看结构，清晰识别哪些是语义容器、哪些是内容图层
- 拖拽图层到新位置时，AI 会实时提示“已进入 Card Body 容器”，帮助建立空间认知
- 选中冗余嵌套组，右键一键“扁平化图层”或“提取为组件”，快速简化结构
这使得层级管理从被动接受转为主动塑造——你不需要等插件“修好”，而是在生成后几秒钟内就能按需调整。
结合 MCP 协议，让 AI 理解你的结构意图
当启用 Model Context Protocol（MCP）后，MasterGo AI 能读取你当前画布中的流程定义、组件命名规范甚至注释文字。例如你在画布顶部写了一句“本页主容器为 DashboardLayout”，AI 在后续生成中就会避免新建同级 Frame，而是将新内容注入该容器，保持整体层级收敛。这种上下文感知能力，让 AI 从“视觉还原工具”升级为“结构协作者”。
