fix(component): 修复组件模态框编辑器内容同步问题

src/components/EditorSection/index.tsx

@@ -39,9 +39,11 @@ const EditorViewer: React.FC<{ content: string }> = ({ content }) => {
 export default function EditorSection({ initialContent, visible, onChange }: EditorSectionProps) {
   const [isClient, setIsClient] = useState(false);
   const [editorLoaded, setEditorLoaded] = useState(false);
-  const [currentContent, setCurrentContent] = useState(initialContent || '');
+  const [editorKey, setEditorKey] = useState(0); // 用于强制重新创建编辑器
   const editorRef = useRef<any>(null);
   const editorInstanceRef = useRef<ToastEditor | null>(null);
+  const initialContentRef = useRef(initialContent); // 记录上一次的 initialContent
+  const isUserEditingRef = useRef(false); // 标记用户是否正在编辑
 
   useEffect(() => {
     if (!isSSR && visible && !editorRef.current) {
@@ -56,15 +58,30 @@ export default function EditorSection({ initialContent, visible, onChange }: Edi
       });
     }
 
-    // 更新当前内容当初始内容变化时
-    setCurrentContent(initialContent || '');
-  }, [initialContent, visible]);
+    // 当 visible 从 false 变为 true 时，重置编辑标记
+    if (visible) {
+      isUserEditingRef.current = false;
+    }
+  }, [visible]);
+
+  // 只在 initialContent 从外部变化时重新创建编辑器（排除用户输入导致的变化）
+  useEffect(() => {
+    // 如果用户正在编辑，不要重新创建编辑器
+    if (isUserEditingRef.current) {
+      return;
+    }
+
+    if (initialContent !== initialContentRef.current) {
+      initialContentRef.current = initialContent;
+      setEditorKey(prev => prev + 1); // 改变 key 强制重新创建
+    }
+  }, [initialContent]);
 
   // 在服务端或组件未加载完成时，使用 Viewer 模式显示内容
   if (!isClient || !editorLoaded || !visible) {
     return (
       <div className="mt-8">
-        <EditorViewer content={currentContent || ''} />
+        <EditorViewer content={initialContent || ''} />
       </div>
     );
   }
@@ -74,15 +91,17 @@ export default function EditorSection({ initialContent, visible, onChange }: Edi
   return (
     <div className="mt-8">
       <DynamicEditor
-        key={visible ? 'editor-visible' : 'editor-hidden'} // 强制重新创建组件
-        initialValue={currentContent}
+        ref={editorInstanceRef}
+        key={`editor-${editorKey}`} // 只在 initialContent 外部变化时改变 key
+        initialValue={initialContent || ''}
         initialEditType="markdown"
         onChange={() => {
+          // 标记用户正在编辑
+          isUserEditingRef.current = true;
+
           // 获取编辑器实例并读取内容
-          const editorInstance = editorRef.current?.getInstance?.();
-          if (editorInstance && onChange) {
-            const content = editorInstance.getMarkdown();
-            setCurrentContent(content);
+          if (editorInstanceRef.current && onChange) {
+            const content = editorInstanceRef.current.getInstance().getMarkdown();
             onChange(content);
           }
         }}

src/pages/componentDevelopment/componentList/addComponentModal.tsx

@@ -437,6 +437,7 @@ const AddComponentModal = ({ visible, baseInfo, setVisible, onReFresh, mode = 'c
       });
 
       // 设置其他状态
+      console.log('baseInfo', baseInfo);
       setSelectedImage(baseInfo.logoUrl || '');
       setDescription(baseInfo.desc || '');
       setShowSaveBtn(true);
@@ -738,6 +739,7 @@ const AddComponentModal = ({ visible, baseInfo, setVisible, onReFresh, mode = 'c
                 visible={visible}
                 initialContent={description}
                 disabled={isReadOnly}
+                onChange={(value) => setDescription(value)}
               />
             </div>
           </div>