输入框设置300ms延迟

src/view/Manage/Model/Component/DebounceInput.jsx

+import React from "react";
+import _ from "lodash";
+
+export default (triggerMs = 0) => {
+  return ReactElement => {
+    class DebounceInput extends React.Component {
+      constructor(props) {
+        super(props);
+        this.state = {};
+        this.state.value = props.value;
+      }
+
+      onChange = (() => {
+        let updb = this.props.onChange;
+        if (triggerMs >= 0) {
+          updb = _.debounce(value => {
+            this.props.onChange(value);
+          }, triggerMs);
+        }
+        return updb;
+      })();
+
+      handleOnChange = event => {
+        const {
+          target: { value }
+        } = event;
+        this.setState({ value });
+        return this.onChange(value);
+      };
+
+      render() {
+        const theProps = {
+          ...this.props,
+          ...this.state
+        };
+        theProps.onChange = this.handleOnChange;
+        return <ReactElement {...theProps} />;
+      }
+    }
+
+    return DebounceInput;
+  };
+};

src/view/Manage/Model/Component/ImportActionTable.jsx

@@ -11,6 +11,7 @@ import { generateUUID, highlightSearchContentByTerms, showMessage, inputWidth, p
 import { dispatch, dispatchLatest } from '../../../../model'; 
 import { addEventListenerForSidebar, removeEventListenerForSidebar } from './Help';
 import { AppContext } from '../../../../App';
+import DebounceInput from './DebounceInput';
 
 import './ImportActionTable.less';
 
@@ -21,6 +22,8 @@ const perSuggestCount = 5;
 const supportMaxAttributeCountPerPage = 100;
 const MENU_ID = 'model-attribute-menu';
 
+const InputDebounce = DebounceInput(300)(Input);
+
 const DatatypeInput = ({ value = {}, datatypes, onChange }) => {
 
   const onNameChange = (value) => {
@@ -129,7 +132,7 @@ const EditableCell = ({
   if (editing) {
     if (dataIndex !== 'datatype') {
 
-      const inputNode = inputType === 'check' ? <Checkbox /> : <Input />
+      const inputNode = inputType === 'check' ? <Checkbox /> : <InputDebounce />
 
       editingComponent = (
         <Form.Item
@@ -1069,9 +1072,9 @@ const ImportActionTable = (props) => {
     [moveRowRef.current],
   );
 
-  const onSearchInputChange = (e) => {
+  const onSearchInputChange = (value) => {
     setEditingKey('');
-    setKeyword(e.target.value||'');
+    setKeyword(value||'');
   }
 
   const sourceOnClick = (id) => {
@@ -1131,7 +1134,7 @@ const ImportActionTable = (props) => {
           </Tooltip>  
         }
         <div className='d-flex' style={{ alignItems: 'center' }}>
-          <Input 
+          <InputDebounce 
             placeholder="请输入中文名称或者英文名称" 
             allowClear 
             value={keyword}

src/view/Manage/Model/index.jsx

@@ -17,11 +17,14 @@ import { showMessage, showNotifaction, inputWidth, DeleteTipModal } from '../../
 import { dispatch, dispatchLatestHomepage } from '../../../model'; 
 import { Action, CatalogId, ModelerId, Hints, ModelerData, PermitCheckOut, Editable, StateId, Holder } from '../../../util/constant';
 import { AppContext } from '../../../App';
+import DebounceInput from './Component/DebounceInput';
 
 import './index.less';
 
 const { Option } = Select;
 
+const InputDebounce = DebounceInput(300)(Input);
+
 class Model extends React.Component {
 
   constructor() {
@@ -183,9 +186,9 @@ class Model extends React.Component {
     this.setState({ historyAndVersionDrawerVisible: true, modelerId: id });
   }
 
-  onSearchInputChange = (e) => {
-    this.setState({ keyword: e.target.value||'', catalogId: '' }, () => {
-      if (e.target.value !== '') {
+  onSearchInputChange = (value) => {
+    this.setState({ keyword: value||'', catalogId: '' }, () => {
+      if (value !== '') {
         this.onTableChange();
       }
     });
@@ -513,11 +516,11 @@ class Model extends React.Component {
                 </Space>
               }     
               <Space>
-                <Input 
+                <InputDebounce 
                   placeholder="通过模型名称全文搜索" 
                   allowClear 
                   value={keyword}
-                  onChange={(e) => { this.onSearchInputChange(e); }} 
+                  onChange={(value) => { this.onSearchInputChange(value); }} 
                   style={{ width: inputWidth, marginLeft: 'auto' }}
                 />
               </Space>