用途:构建基于 Vercel AI SDK v5/v6 的 React 聊天界面,覆盖流式 UI 模式、工具审批工作流与智能体集成;不涵盖后端 AI 实现(见 ai-sdk-core)及生成式 UI/RSC。
主要能力:使用 useChat 实现带流式传输的聊天界面,useCompletion 处理文本补全,useObject 生成结构化数据,useAssistant 对接兼容 OpenAI 的助手 API。v6 中可通过 addToolApprovalResponse 处理工具审批,使用 InferAgentUIMessage 做类型安全的智能体集成。
使用方式:假设环境为 AI SDK v5.0.99+ 或 v6.0.0-beta.108+、React 18+(支持 React 19)、Next.js 14+(13.4+ 可用)及 @ai-sdk/react 包。基础用法示例:import { useChat } from '@ai-sdk/react',在组件中调用 useChat({ api: '/api/chat' }),配合 messages、input、handleInputChange、handleSubmit、isLoading 渲染表单。工具审批示例:const { messages, addToolApprovalResponse } = useChat({ api: '/api/chat' }),再调用 addToolApprovalResponse({ toolCallId: 'id', approved: true })。App Router 使用 toDataStreamResponse(),Pages Router 使用 pipeDataStreamToResponse()。
适用场景:实现 AI SDK v5/v6 聊天界面、流式响应展示、工具调用审批交互及智能体前端集成。
限制与约束:必须使用流式响应;动态 body 值需用受控模式(sendMessage 传 data 而非 body 选项),否则会读取到旧值;需处理 isLoading 与 error;建议支持 stop 取消生成、流式自动滚动、加载指示;避免非流式响应、在 useEffect 中无限循环(仅依赖 messages)、未迁移就混用 v5 与 v6 API。