fix: Changes in the editor content will reset the values of other form fields.

Author: shuai

i18n/zh_CN.yaml

@@ -1760,7 +1760,7 @@ ui:
     users: 用户管理
     badges: 徽章
     flags: 举报管理
-    settings: 站点设置
+    settings: 设置
     general: 一般
     interface: 界面
     smtp: SMTP

ui/src/pages/Questions/Ask/index.tsx

@@ -147,8 +147,11 @@ const Ask = () => {
       if (prefill || draft) {
         if (prefill) {
           const file = fm<any>(decodeURIComponent(prefill));
-          formData.title.value = file.attributes?.title;
-          formData.content.value = file.body;
+          setFormData((prev) => ({
+            ...prev,
+            title: { ...prev.title, value: file.attributes?.title || '' },
+            content: { ...prev.content, value: file.body || '' },
+          }));
           if (!queryTags && file.attributes?.tags) {
             // Remove spaces in file.attributes.tags
             const filterTags = file.attributes.tags
@@ -158,14 +161,19 @@ const Ask = () => {
             updateTags(filterTags);
           }
         } else if (draft) {
-          formData.title.value = draft.title;
-          formData.content.value = draft.content;
-          formData.tags.value = draft.tags;
-          formData.answer_content.value = draft.answer_content;
+          setFormData((prev) => ({
+            ...prev,
+            title: { ...prev.title, value: draft.title || '' },
+            content: { ...prev.content, value: draft.content || '' },
+            tags: { ...prev.tags, value: draft.tags || [] },
+            answer_content: {
+              ...prev.answer_content,
+              value: draft.answer_content || '',
+            },
+          }));
           setCheckState(Boolean(draft.answer_content));
           setHasDraft(true);
         }
-        setFormData({ ...formData });
       } else {
         resetForm();
       }
@@ -231,17 +239,25 @@ const Ask = () => {
       return;
     }
     questionDetail(qid).then((res) => {
-      formData.title.value = res.title;
-      formData.content.value = res.content;
-      formData.tags.value = res.tags.map((item) => {
-        return {
-          ...item,
-          parsed_text: '',
-          original_text: '',
+      setFormData((prev) => {
+        const updatedFormData = {
+          ...prev,
+          title: { ...prev.title, value: res.title },
+          content: { ...prev.content, value: res.content },
+          tags: {
+            ...prev.tags,
+            value: res.tags.map((item) => {
+              return {
+                ...item,
+                parsed_text: '',
+                original_text: '',
+              };
+            }),
+          },
         };
+        setImmData(updatedFormData);
+        return updatedFormData;
       });
-      setImmData({ ...formData });
-      setFormData({ ...formData });
     });
   }, [qid]);
 
@@ -255,10 +271,10 @@ const Ask = () => {
   );
 
   const handleTitleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setFormData({
-      ...formData,
+    setFormData((prev) => ({
+      ...prev,
       title: { value: e.currentTarget.value, errorMsg: '', isInvalid: false },
-    });
+    }));
     if (e.currentTarget.value.length >= 10) {
       querySimilarQuestions(e.currentTarget.value);
     }
@@ -267,31 +283,31 @@ const Ask = () => {
     }
   };
   const handleContentChange = (value: string) => {
-    setFormData({
-      ...formData,
+    setFormData((prev) => ({
+      ...prev,
       content: { value, errorMsg: '', isInvalid: false },
-    });
+    }));
   };
   const handleTagsChange = (value) =>
-    setFormData({
-      ...formData,
+    setFormData((prev) => ({
+      ...prev,
       tags: { value, errorMsg: '', isInvalid: false },
-    });
+    }));
 
   const handleAnswerChange = (value: string) =>
-    setFormData({
-      ...formData,
+    setFormData((prev) => ({
+      ...prev,
       answer_content: { value, errorMsg: '', isInvalid: false },
-    });
+    }));
 
   const handleSummaryChange = (evt: React.ChangeEvent<HTMLInputElement>) =>
-    setFormData({
-      ...formData,
+    setFormData((prev) => ({
+      ...prev,
       edit_summary: {
-        ...formData.edit_summary,
+        ...prev.edit_summary,
         value: evt.currentTarget.value,
       },
-    });
+    }));
 
   const deleteDraft = () => {
     const res = window.confirm(t('discard_confirm', { keyPrefix: 'draft' }));
@@ -413,9 +429,17 @@ const Ask = () => {
   const handleSelectedRevision = (e) => {
     const index = e.target.value;
     const revision = revisions[index];
-    formData.content.value = revision.content?.content || '';
-    setImmData({ ...formData });
-    setFormData({ ...formData });
+    setFormData((prev) => {
+      const updated = {
+        ...prev,
+        content: {
+          ...prev.content,
+          value: revision.content?.content || '',
+        },
+      };
+      setImmData(updated);
+      return updated;
+    });
   };
   const bool = similarQuestions.length > 0 && !isEdit;
   let pageTitle = t('ask_a_question', { keyPrefix: 'page_title' });