fix: 编辑回显 - 移除 destroyOnClose + setTimeout 延迟赋值

- 移除 Modal destroyOnClose 和 Form preserve={false},避免 DOM 生命周期冲突
- useEffect 内 setTimeout(fn, 0) 延迟到下一 tick,确保 Form 已挂载
- onCancel 时手动 form.resetFields()
This commit is contained in:
zwt13703 2026-07-06 18:45:21 +08:00
parent e2133165b0
commit ba2171e13e
2 changed files with 37 additions and 28 deletions

View File

@ -48,16 +48,24 @@ export default function ModelList() {
useEffect(() => { useEffect(() => {
if (!modalOpen) return; if (!modalOpen) return;
if (editingModel) { // 延迟确保 Form DOM 已渲染
form.setFieldsValue({ const timer = setTimeout(() => {
...editingModel, if (editingModel) {
extra_params: JSON.stringify(editingModel.extra_params, null, 2), form.setFieldsValue({
api_key: "", name: editingModel.name,
}); provider: editingModel.provider,
} else { endpoint: editingModel.endpoint,
form.resetFields(); api_key: "",
form.setFieldsValue({ provider: "openai", is_enabled: true, extra_params: "{}" }); extra_params: JSON.stringify(editingModel.extra_params, null, 2),
} is_enabled: editingModel.is_enabled,
remark: editingModel.remark,
});
} else {
form.resetFields();
form.setFieldsValue({ provider: "openai", is_enabled: true, extra_params: "{}" });
}
}, 0);
return () => clearTimeout(timer);
}, [modalOpen, editingModel]); }, [modalOpen, editingModel]);
const handleSubmit = async () => { const handleSubmit = async () => {
@ -177,12 +185,11 @@ export default function ModelList() {
<Modal <Modal
title={editingModel ? "编辑模型" : "新建模型"} title={editingModel ? "编辑模型" : "新建模型"}
open={modalOpen} open={modalOpen}
onCancel={() => setModalOpen(false)} onCancel={() => { setModalOpen(false); form.resetFields(); }}
onOk={handleSubmit} onOk={handleSubmit}
width={600} width={600}
destroyOnClose
> >
<Form form={form} layout="vertical" preserve={false}> <Form form={form} layout="vertical">
<Form.Item name="name" label="名称" rules={[{ required: true }]}> <Form.Item name="name" label="名称" rules={[{ required: true }]}>
<Input placeholder="模型名称" /> <Input placeholder="模型名称" />
</Form.Item> </Form.Item>

View File

@ -124,21 +124,24 @@ export default function TemplateEditor() {
useEffect(() => { useEffect(() => {
if (!pointModalOpen) return; if (!pointModalOpen) return;
if (editingPoint) { const timer = setTimeout(() => {
pointForm.setFieldsValue({ if (editingPoint) {
prompt: editingPoint.prompt,
model_id: editingPoint.model_id,
need_ref_file: editingPoint.need_ref_file,
remark: editingPoint.remark,
});
} else {
pointForm.resetFields();
if (selectionRef.current) {
pointForm.setFieldsValue({ pointForm.setFieldsValue({
prompt: `根据上下文生成关于「${selectionRef.current.text.slice(0, 20)}...」的内容`, prompt: editingPoint.prompt,
model_id: editingPoint.model_id,
need_ref_file: editingPoint.need_ref_file,
remark: editingPoint.remark,
}); });
} else {
pointForm.resetFields();
if (selectionRef.current) {
pointForm.setFieldsValue({
prompt: `根据上下文生成关于「${selectionRef.current.text.slice(0, 20)}...」的内容`,
});
}
} }
} }, 0);
return () => clearTimeout(timer);
}, [pointModalOpen]); }, [pointModalOpen]);
const handlePointSubmit = async () => { const handlePointSubmit = async () => {
@ -478,12 +481,11 @@ export default function TemplateEditor() {
<Modal <Modal
title={editingPoint ? "编辑生成点" : "新建生成点"} title={editingPoint ? "编辑生成点" : "新建生成点"}
open={pointModalOpen} open={pointModalOpen}
onCancel={() => setPointModalOpen(false)} onCancel={() => { setPointModalOpen(false); pointForm.resetFields(); }}
onOk={handlePointSubmit} onOk={handlePointSubmit}
width={560} width={560}
destroyOnClose
> >
<Form form={pointForm} layout="vertical" preserve={false}> <Form form={pointForm} layout="vertical">
{selectionRef.current && !editingPoint && ( {selectionRef.current && !editingPoint && (
<div <div
style={{ style={{