mastergo ai 不主动推荐基础组件,而是根据自然语言描述智能调用匹配的组件库资源生成原型页面,支持平台规范适配、上下文连贯修改及组件复用与代码导出。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

MasterGo AI 不会“主动推荐”基础组件,而是根据你输入的自然语言描述,自动识别并调用匹配的组件库资源,生成包含合理结构与常用控件的原型页面。
AI 如何理解并选用基础组件
当你输入类似“首页包含搜索栏、轮播图、商品列表、底部tabbar”这样的描述时,AI 会自动拆解语义:
- “搜索栏” → 匹配输入框+搜索图标组合(默认采用 iOS 或 Material Design 风格的原生组件)
- “轮播图” → 调用带指示器和自动切换逻辑的 Banner 组件
- “商品列表” → 插入带图片、标题、价格、操作按钮的卡片式重复容器
- “底部tabbar” → 渲染含图标+文字标签的固定导航栏,并预设选中态交互
这些组件并非随机生成,而是从 MasterGo 内置的移动端/iOS/Android/Web 组件库中按平台规范智能调取,确保结构可用、样式合规。
组件选择受哪些因素影响
AI 的组件选用不是固定映射,而是动态适配,主要依据三点:
- 平台类型明确性:若你写“iOS 端个人中心页”,AI 优先调用 SF Symbols 图标 + 圆角卡片 + 大标题导航栏;若写“后台管理系统”,则倾向 Ant Design 风格的表格、折叠菜单、顶部导航
- 关键词强度:“带点赞和评论的短视频流”比“内容页”更能触发 Feed 流组件(含 Avatar、文案区、互动按钮组);“购物车图标在右上角”会直接定位到导航栏 Action 区域
- 上下文连贯性:连续对话中修改需求,如先生成首页后追加“把商品列表改成瀑布流”,AI 会保留原有结构,仅替换列表容器为支持滚动加载的垂直布局组件
如何让 AI 选对组件
不需要记忆组件名,但需用具体行为或视觉特征引导 AI 判断:
- 用动词代替名词:“用户能下拉刷新” → 触发带刷新指示器的可滚动容器
- 强调交互意图:“点击头像跳转编辑页” → 自动添加可点击区域+跳转箭头图标+轻触反馈效果
- 指定视觉线索:“价格显示为红色加粗” → 启用 Text 组件并预设 color=#FF4D4F、fontWeight=700 样式
- 避免模糊表述:不说“一个好看的按钮”,而说“主行动按钮,圆角8px,背景色#FA2549,文字白色,居中固定在底部”
生成后若组件不符合预期,可直接用自然语言调整:“把搜索栏换成带语音输入图标的版本”“商品卡片去掉边框,增加阴影”,AI 会精准替换对应元素。
组件复用与自定义延伸
AI 生成的组件天然支持后续复用:
- 生成的轮播图、tabbar、列表等模块可一键转为「可复用组件」,存入团队设计系统
- 修改某商品卡片样式后,勾选“同步更新同类型实例”,所有同类卡片自动跟随
- 导出代码时,组件会被封装为 Vue/React 单文件组件(如
),含 props 接口和默认样式
它不提供“组件推荐弹窗”,但通过语义解析+平台规范+上下文记忆,让组件选择变得隐形而准确。











