解决完编辑用户消息相关的bug之后重新生成又出现了新的新的新新的bug(本飘心已死~)
当点击重新重新生成按钮时会出现两个气泡:
这个bug出现的原因是:在regenerateResponse
方法中,我们既重置了当前消息内容,又在startStreamingResponse
中创建了一个新的消息。
所以需要再次修改这两个方法:
修改regenerateResponse
方法,避免重复创建消息:
async regenerateResponse(index) {try {if (!this.currentConversation?.id) return;// 准备消息历史(排除上次的AI回复)const messagesToSend = this.messages.slice(0, index).filter(msg => msg.role !== 'assistant' || msg !== this.messages[index]).map(msg => ({ role: msg.role, content: msg.content }));// 重置当前消息内容而不创建新消息this.messages[index] = {role: 'assistant',content: '',isStreaming: true,renderedContent: ''};this.currentStreamingMessage = this.messages[index];this.isGenerating = true;// 创建新的中断控制器this.abortController = new AbortController();// 调用流式API重新生成await this.startStreamingResponse({messages: messagesToSend,conversationId: this.currentConversation.id,regenerateIndex: index // 添加这个参数告诉startStreamingResponse不要创建新消息}, this.abortController.signal);} catch (error) {console.error("重新生成失败", error);if (this.currentStreamingMessage) {this.currentStreamingMessage.content = "重新生成失败: " + (error.message || "未知错误");this.currentStreamingMessage.isStreaming = false;}this.isGenerating = false;}
},
然后修改startStreamingResponse
方法:
async startStreamingResponse(requestData, signal) {this.closeEventSource();// 只有在不是重新生成时才创建新消息if (requestData.regenerateIndex === undefined) {// 创建新的AI消息const newMessage = {role: "assistant",content: "",isStreaming: true,renderedContent: ""};this.messages.push(newMessage);this.currentStreamingMessage = newMessage;} else {// 如果是重新生成,使用已存在的消息this.currentStreamingMessage = this.messages[requestData.regenerateIndex];}try {const response = await fetch('http://localhost:8080/api/chat/stream', {method: 'POST',headers: { 'Content-Type': 'application/json' },body: JSON.stringify(requestData),signal});// 其余代码保持不变...} catch (error) {this.handleStreamError(error, rawContent);}
}
这样修改后,当用户点击"重新生成"按钮时,系统会重用原有的消息气泡而不是创建新的气泡,从而避免了重复气泡的问题。
至此已没有新的bug出现,希望这个连续剧至此完结!!!