fm453/nocobase
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2025-07-01 18:52:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: button add anti double click processing (#6351)

Browse Source 
* feat: button add anti double click processing

* feat: remove useless files

* fix: add conditional debounce to button click handling for E2E testing

---------

Co-authored-by: Zeke Zhang <958414905@qq.com>
This commit is contained in:
chenyongxin 2025-03-06 08:09:06 +08:00 committed by GitHub
parent 841472155b
commit 8d40210948
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/core/client/src/schema-component/antd/action/Action.tsx
View File

@ -12,6 +12,7 @@ import { observer, Schema, useField, useFieldSchema, useForm } from '@formily/re
import { isPortalInBody } from '@nocobase/utils/client';
import { App, Button } from 'antd';
import classnames from 'classnames';
import debounce from 'lodash/debounce';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { ErrorBoundary } from 'react-error-boundary';
import { useTranslation } from 'react-i18next';
@ -522,7 +523,7 @@ const RenderButtonInner = observer(
buttonStyle: React.CSSProperties;
handleMouseEnter: (e: React.MouseEvent) => void;
getAriaLabel: (postfix?: string) => string;
handleButtonClick: (e: React.MouseEvent) => void;
handleButtonClick: (e: React.MouseEvent, checkPortal?: boolean) => void;
tarComponent: React.ElementType;
componentCls: string;
hashId: string;
@ -558,6 +559,23 @@ const RenderButtonInner = observer(
return null;
}
const debouncedClick = useCallback(
debounce(
(e: React.MouseEvent, checkPortal = true) => {
handleButtonClick(e, checkPortal);
},
300,
{ leading: true, trailing: false },
),
[handleButtonClick],
);
useEffect(() => {
return () => {
debouncedClick.cancel();
};
}, []);
const actionTitle = title || field?.title;
return (
@ -571,7 +589,7 @@ const RenderButtonInner = observer(
icon={typeof icon === 'string' ? <Icon type={icon} /> : icon}
disabled={disabled}
style={buttonStyle}
onClick={handleButtonClick}
onClick={process.env.__E2E__ ? handleButtonClick : debouncedClick} // E2E 中的点击操作都是很快的，如果加上 debounce 会导致 E2E 测试失败
component={tarComponent || Button}
className={classnames(componentCls, hashId, className, 'nb-action')}
type={type === 'danger' ? undefined : type}