diff --git a/src/components/EditorSection/index.tsx b/src/components/EditorSection/index.tsx index 4c95354..be641c7 100644 --- a/src/components/EditorSection/index.tsx +++ b/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(null); const editorInstanceRef = useRef(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 (
- +
); } @@ -74,15 +91,17 @@ export default function EditorSection({ initialContent, visible, onChange }: Edi return (
{ + // 标记用户正在编辑 + 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); } }} diff --git a/src/pages/componentDevelopment/componentList/addComponentModal.tsx b/src/pages/componentDevelopment/componentList/addComponentModal.tsx index 1bc25b8..527e274 100644 --- a/src/pages/componentDevelopment/componentList/addComponentModal.tsx +++ b/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)} />