diff --git a/frontend/packages/workflow/test-run/src/components/form-materials/full-input/full-input.tsx b/frontend/packages/workflow/test-run/src/components/form-materials/full-input/full-input.tsx index 76d07385c..a85d10417 100644 --- a/frontend/packages/workflow/test-run/src/components/form-materials/full-input/full-input.tsx +++ b/frontend/packages/workflow/test-run/src/components/form-materials/full-input/full-input.tsx @@ -17,6 +17,7 @@ import { useState, useEffect, useRef, Suspense } from 'react'; import { nanoid } from 'nanoid'; +import { debounce } from 'lodash-es'; import cls from 'classnames'; import { connect, mapProps } from '@formily/react'; import type { Editor } from '@coze-common/md-editor-adapter'; @@ -56,23 +57,25 @@ const InnerFullInputAdapter: React.FC = ({ const businessKeyRef = useRef(nanoid()); const innerValueRef = useRef(); - const handleChange = (v: string) => { - if (!editorRef.current) { - return; - } - /** - * deltas => md - */ - const content = editorRef.current.getContent(); - const { markdown } = delta2md(content.deltas[0], content.deltas); - /** - * Changes may come from user input or initialization, do a diff to ensure performance - */ - if (markdown !== innerValueRef.current) { - innerValueRef.current = markdown; - onChange(markdown); - } - }; + const handleChange = useRef( + debounce((v: string) => { + if (!editorRef.current) { + return; + } + /** + * deltas => md + */ + const content = editorRef.current.getContent(); + const { markdown } = delta2md(content.deltas[0], content.deltas); + /** + * Changes may come from user input or initialization, do a diff to ensure performance + */ + if (markdown !== innerValueRef.current) { + innerValueRef.current = markdown; + onChange(markdown); + } + }, 500), + ).current; useEffect(() => { if (value !== innerValueRef.current) { @@ -84,6 +87,13 @@ const InnerFullInputAdapter: React.FC = ({ } }, [value]); + useEffect( + () => () => { + handleChange.cancel(); + }, + [handleChange], + ); + return (