fix: 修复新建技能后输入框无法编辑的问题

问题:点击新建技能按钮后,对话框中预设的文字无法删除或修改
原因:useEffect 依赖项包含 promptInputController.textInput,该对象在每次输入时都会重新创建,导致 useEffect 重复执行并覆盖用户输入
解决:使用 useRef 保存 setInput 方法,并跟踪已设置的初始值,确保 useEffect 只在初始值变化时执行一次

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
LofiSu
2026-02-10 12:39:44 +08:00
parent cc88823a64
commit b3a1f018ab

View File

@@ -4,7 +4,7 @@ import type { Message } from "@langchain/langgraph-sdk";
import type { UseStream } from "@langchain/langgraph-sdk/react";
import { FilesIcon, XIcon } from "lucide-react";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useCallback, useEffect, useMemo, useState } from "react";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { ConversationEmptyState } from "@/components/ai-elements/conversation";
import { usePromptInputController } from "@/components/ai-elements/prompt-input";
@@ -63,10 +63,14 @@ export default function ChatPage() {
}
return t.inputBox.createSkillPrompt;
}, [threadIdFromPath, searchParams, t.inputBox.createSkillPrompt]);
const lastInitialValueRef = useRef<string | undefined>(undefined);
const setInputRef = useRef(promptInputController.textInput.setInput);
setInputRef.current = promptInputController.textInput.setInput;
useEffect(() => {
if (inputInitialValue) {
if (inputInitialValue && inputInitialValue !== lastInitialValueRef.current) {
lastInitialValueRef.current = inputInitialValue;
setTimeout(() => {
promptInputController.textInput.setInput(inputInitialValue);
setInputRef.current(inputInitialValue);
const textarea = document.querySelector("textarea");
if (textarea) {
textarea.focus();
@@ -75,7 +79,7 @@ export default function ChatPage() {
}
}, 100);
}
}, [inputInitialValue, promptInputController.textInput]);
}, [inputInitialValue]);
const isNewThread = useMemo(
() => threadIdFromPath === "new",
[threadIdFromPath],