1.2 KiB
1.2 KiB
AiChatComposer 输入框
对话输入框,按状态在发送、停止与重试之间切换。
基础用法
:::preview 基础用法 || 发送后进入生成态,2 秒后自动恢复,可观察按钮的三种形态
demo-preview=../demos/ai-chat-composer/basic.vue
:::
何时使用
需要单独摆放输入框时使用。多数情况下直接用 AiChatPanel 更省事。
三种按钮形态
| 状态 | 按钮 |
|---|---|
| 默认 | 发送(sendText) |
isGenerating 为真 |
停止(stopText,危险色) |
有 lastError 且 canRetry |
错误条 + 重试(retryText) |
生成中或 disabled 为真时输入框不可编辑,send 事件也不会抛出。
事件
send:抛出去除首尾空白后的内容,抛完自动清空输入框;空内容不抛stop:点停止按钮retry:点错误条上的重试
输入框内容用 v-model 绑定,maxLength 默认 2000。
自定义插槽
send、stop、error 三个插槽可以替换对应区域的渲染,都带作用域参数(disabled、onSend、onStop、error、canRetry)。