Components
FollowupSuggestions
对话结束后的追问建议，自动发送建议 prompt
当对话完成后，ThreadFollowupSuggestions 会显示 AI 提供的追问建议按钮。
引入
import { ThreadFollowupSuggestions } from "aui-components";Props
该组件没有公开的 Props。
基本用法
Thread 内部已预配置 FollowupSuggestions，无需手动使用：
// Thread 内部代码
<ThreadPrimitive.ViewportFooter>
<ThreadScrollToBottom />
<ThreadFollowupSuggestions /> {/* 已预配置 */}
<Composer />
</ThreadPrimitive.ViewportFooter>渲染条件
ThreadFollowupSuggestions 使用 AuiIf 条件渲染，仅在以下条件下显示：
- 线程非空（
!s.thread.isEmpty） - 线程不在运行中（
!s.thread.isRunning） - 有可用建议（
s.thread.suggestions.length > 0）
<AuiIf
condition={(s) =>
!s.thread.isEmpty && !s.thread.isRunning && s.thread.suggestions.length > 0
}
>
<div className="flex items-center justify-center gap-2">
{suggestions.map((suggestion, idx) => (
<ThreadPrimitive.Suggestion
key={idx}
prompt={suggestion.prompt}
method="replace"
autoSend
>
{suggestion.prompt}
</ThreadPrimitive.Suggestion>
))}
</div>
</AuiIf>配置
建议内容
建议内容由后端生成并通过 assistant-ui 的 s.thread.suggestions 传递：
// 后端返回示例
{
suggestions: [
{ prompt: "Tell me more about this topic" },
{ prompt: "Can you explain it in simpler terms?" },
];
}样式
每个建议渲染为圆角按钮：
<ThreadPrimitive.Suggestion
className="bg-background hover:bg-muted/80 rounded-full border px-3 py-1 text-sm"
prompt={suggestion.prompt}
method="replace"
autoSend
>
{suggestion.prompt}
</ThreadPrimitive.Suggestion>method="replace"— 替换输入框内容autoSend— 自动发送
相关链接
- Thread — FollowupSuggestions 的使用上下文