uni-app Vue 3 如何搭建 AI Agent 对话界面？

开发移动端 Agent 时，界面除了显示对话，还可能需要呈现推理过程、工具调用、执行计划和人工审批。AIKO Agent Kit 是面向 uni-app Vue 3 的前端组件方案，作者 Nexus Wang。

• DCloud 插件市场：AIKit
• 组件文档与开发规范
• 在线体验 Agent Studio

能用于哪些场景？

可以用对话、消息和输入组件搭建聊天界面；使用 Plan、Tool、Confirmation 展示 Agent 执行计划、工具调用与审批；使用代码、终端和文件树组件呈现开发类任务结果。具体组件及接口请以安装版本的文档和类型声明为准。

怎么开始？

1. 从插件市场导入 aiko-ai-elements，按市场文档安装依赖与配置主题。
2. 从对话、消息和输入组件开始，先用本地模拟数据验证发送、停止和错误状态。
3. 再根据目标端接入自己的服务端和传输协议，处理鉴权、模型调用与真实工具执行。
4. 按目标平台测试 Markdown、流式响应、权限和异常处理。

常见问题

支持 uni-app x 吗？ 当前资料面向 uni-app Vue 3，尚未适配 uni-app x，也不包含 nvue。

在线演示会调用真实模型吗？ 在线演示使用离线模拟，不需要 API Key，不执行真实工具。GitHub 的开发预览可能与市场已发布版本不同，具体能力以所安装版本为准。

GitHub 包含付费组件源码吗？ 仓库说明其公开的是文档、接口清单与截图；组件使用源码应从插件市场取得。

验证到什么程度？ 仓库记录 H5 浏览器主要交互和多端构建检查；小程序开发者工具及 Android/iOS 真机尚未运行。请结合最新验证记录和目标设备自行测试。

关键词：uni-app Agent 组件、Vue 3 AI 对话界面、智能体工具调用、人工审批、AIKO Agent Kit。