Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitc6f2d79

Browse files
fix memory leaks and convert click event wrapper to hook
1 parenta27f132 commitc6f2d79

File tree

2 files changed

+35
-18
lines changed

2 files changed

+35
-18
lines changed

‎client/packages/lowcoder/src/comps/comps/buttonComp/buttonComp.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ import { AnimationStyle } from "@lowcoder-ee/comps/controls/styleControlConstant
2929
import{styleControl}from"@lowcoder-ee/comps/controls/styleControl";
3030
import{RecordConstructorToComp}from"lowcoder-core";
3131
import{ToViewReturn}from"@lowcoder-ee/comps/generators/multi";
32-
import{ComponentClickHandler}from"@lowcoder-ee/comps/utils/componentClickHandler";
32+
import{useCompClickEventHandler}from"@lowcoder-ee/comps/utils/componentClickHandler";
3333

3434
constFormLabel=styled(CommonBlueLabel)`
3535
font-size: 13px;
@@ -182,6 +182,7 @@ const ButtonPropertyView = React.memo((props: {
182182
constButtonView=React.memo((props:ToViewReturn<ChildrenType>)=>{
183183
consteditorState=useContext(EditorContext);
184184
constmountedRef=useRef<boolean>(true);
185+
consthandleClickEvent=useCompClickEventHandler({onEvent:props.onEvent});
185186

186187
useEffect(()=>{
187188
return()=>{
@@ -194,7 +195,8 @@ const ButtonView = React.memo((props: ToViewReturn<ChildrenType>) => {
194195

195196
try{
196197
if(isDefault(props.type)){
197-
ComponentClickHandler({onEvent:props.onEvent})()
198+
// ComponentClickHandler({onEvent: props.onEvent})()
199+
handleClickEvent();
198200
}else{
199201
submitForm(editorState,props.form);
200202
}
Lines changed: 31 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
importReactfrom"react";
1+
importReact,{useCallback,useRef}from"react";
22

33
exportenumClickEventType{
44
CLICK="click",
@@ -10,23 +10,38 @@ interface Props {
1010
}
1111

1212
constDOUBLE_CLICK_THRESHOLD=300;// ms
13-
letlastClickTime=0;
14-
letclickTimer:ReturnType<typeofsetTimeout>;
1513

16-
exportconstComponentClickHandler=(props:Props)=>{
17-
return()=>{
18-
constnow=Date.now()
19-
clearTimeout(clickTimer)
14+
exportconstuseCompClickEventHandler=(props:Props)=>{
15+
constlastClickTimeRef=useRef(0);
16+
constclickTimerRef=useRef<ReturnType<typeofsetTimeout>>();
2017

21-
if((now-lastClickTime)<DOUBLE_CLICK_THRESHOLD){
22-
clearTimeout(clickTimer)
23-
props.onEvent(ClickEventType.DOUBLE_CLICK)
18+
consthandleClick=useCallback(()=>{
19+
constnow=Date.now();
20+
21+
// Clear any existing timeout
22+
if(clickTimerRef.current){
23+
clearTimeout(clickTimerRef.current);
24+
}
25+
26+
if((now-lastClickTimeRef.current)<DOUBLE_CLICK_THRESHOLD){
27+
props.onEvent(ClickEventType.DOUBLE_CLICK);
2428
}else{
25-
clickTimer=setTimeout(()=>{
26-
props.onEvent(ClickEventType.CLICK)
27-
},DOUBLE_CLICK_THRESHOLD)
29+
clickTimerRef.current=setTimeout(()=>{
30+
props.onEvent(ClickEventType.CLICK);
31+
},DOUBLE_CLICK_THRESHOLD);
2832
}
2933

30-
lastClickTime=now
31-
}
32-
}
34+
lastClickTimeRef.current=now;
35+
},[props.onEvent]);
36+
37+
// Cleanup on unmount
38+
React.useEffect(()=>{
39+
return()=>{
40+
if(clickTimerRef.current){
41+
clearTimeout(clickTimerRef.current);
42+
}
43+
};
44+
},[]);
45+
46+
returnhandleClick;
47+
};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp