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

Commit0ef3216

Browse files
memoize uiCompBuilder
1 parentcd948af commit0ef3216

File tree

1 file changed

+61
-40
lines changed

1 file changed

+61
-40
lines changed

‎client/packages/lowcoder/src/comps/generators/uiCompBuilder.tsx‎

Lines changed: 61 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import{BoolCodeControl,StringControl}from"comps/controls/codeControl";
2-
importReact,{ReactNode,useContext,useEffect,useRef,useState}from"react";
2+
importReact,{ReactNode,useCallback,useContext,useEffect,useMemo,useRef,useState}from"react";
33
import{ExternalEditorContext}from"util/context/ExternalEditorContext";
44
import{Comp,CompParams,MultiBaseComp}from"lowcoder-core";
55
import{
@@ -28,7 +28,7 @@ import { BoolControl } from "../controls/boolControl";
2828
import{valueComp,withDefault}from"./simpleGenerators";
2929
import{getPromiseAfterDispatch}from"@lowcoder-ee/util/promiseUtils";
3030
import{EditorContext}from"../editorState";
31-
import{values}from"lodash";
31+
import{isEqual,values}from"lodash";
3232
import{UICompType,uiCompRegistry}from"../uiCompRegistry";
3333
import{getNpmPackageMeta}from"../utils/remote";
3434
import{compPluginsList}from"constants/compPluginConstants";
@@ -289,44 +289,34 @@ const UIView = React.memo((props: {
289289
childrenProps['disabled']=disabled||parentDisabled;
290290
}
291291

292-
//ADDED BY FRED
293-
if(childrenProps.events){
294-
constevents=childrenProps.eventsas{value?:any[]};
295-
if(!events.value||events.value.length===0){
296-
events.value=[];
297-
}
298-
}
299-
//END ADD BY FRED
300-
301292
useMergeCompStyles(
302293
childrenJsonPropsasRecord<string,any>,
303294
comp.dispatch
304295
);
305296

306-
// render condition for modal and drawer as we are not getting compType here
307-
if(comp.children.hasOwnProperty('showMask')&&comp.children.hasOwnProperty('maskClosable')){
308-
return(
309-
<HidableViewhidden={childrenProps.hiddenasboolean}>
310-
{props.viewFn(
311-
childrenProps,
312-
comp.dispatch
313-
)}
314-
</HidableView>
315-
);
316-
}
297+
constdefaultChildren=useMemo(()=>comp.children,[comp.children]);
298+
constisNotContainer=useMemo(()=>Boolean(defaultChildren.style),[defaultChildren.style]);
299+
constrestrictPaddingOnRotation=useMemo(()=>Boolean(defaultChildren.restrictPaddingOnRotation),[defaultChildren.restrictPaddingOnRotation]);
300+
constrotationVal=useMemo(()=>{
301+
if(isNotContainer){
302+
returndefaultChildren.style.children?.rotation?.valueAndMsg.value
303+
}
304+
returnnull;
305+
},[isNotContainer,defaultChildren.style.children?.rotation?.valueAndMsg.value]);
306+
constboxShadowVal=useMemo(()=>{
307+
if(isNotContainer){
308+
returndefaultChildren.style?.children?.boxShadow?.valueAndMsg?.value;
309+
}
310+
returnnull;
311+
},[isNotContainer,defaultChildren.style?.children?.boxShadow?.valueAndMsg?.value]);
312+
constrestrictPaddingOnRotationVal=useMemo(()=>{
313+
if(isNotContainer){
314+
returndefaultChildren?.restrictPaddingOnRotation?.valueAndMsg?.value
315+
}
316+
returnnull;
317+
},[isNotContainer,defaultChildren?.restrictPaddingOnRotation?.valueAndMsg?.value]);
317318

318-
letdefaultChildren=comp.children;
319-
constisNotContainer=defaultChildren.hasOwnProperty('style');
320-
constrestrictPaddingOnRotation=defaultChildren.hasOwnProperty('restrictPaddingOnRotation');
321-
letrotationVal:any=null
322-
letboxShadowVal:any=null;
323-
letrestrictPaddingOnRotationVal:any=null;
324-
if(isNotContainer){
325-
rotationVal=defaultChildren.style.children?.rotation?.valueAndMsg.value;
326-
boxShadowVal=defaultChildren.style?.children?.boxShadow?.valueAndMsg?.value;
327-
restrictPaddingOnRotationVal=defaultChildren?.restrictPaddingOnRotation?.valueAndMsg?.value;
328-
}
329-
constgetPadding=()=>{
319+
constgetPadding=useCallback(()=>{
330320
if(
331321
(rotationVal===null||
332322
rotationVal===undefined||
@@ -386,9 +376,22 @@ const UIView = React.memo((props: {
386376
}else{
387377
return'0px';// Default value if neither rotation nor box-shadow is applied
388378
}
389-
};
379+
},[
380+
rotationVal,
381+
boxShadowVal,
382+
restrictPaddingOnRotationVal,
383+
restrictPaddingOnRotation,
384+
]);
390385

391-
return(
386+
// render condition for modal and drawer as we are not getting compType here
387+
388+
constuiCompRender=useMemo(()=>props.viewFn(childrenProps,comp.dispatch),[
389+
childrenProps,
390+
comp.dispatch
391+
]);
392+
393+
constuiCompRenderWithWrapper=useMemo(()=>{
394+
return(
392395
<div
393396
ref={props.innerRef}
394397
className={childrenProps.classNameasstring}
@@ -400,9 +403,27 @@ const UIView = React.memo((props: {
400403
padding:getPadding()
401404
}}
402405
>
403-
<HidableViewhidden={childrenProps.hiddenasboolean}>
404-
{props.viewFn(childrenProps,comp.dispatch)}
405-
</HidableView>
406+
{uiCompRender}
406407
</div>
407-
);
408+
)},[
409+
uiCompRender,
410+
props.innerRef,
411+
childrenProps.className,
412+
childrenProps.dataTestId,
413+
getPadding,
414+
]);
415+
416+
constrenderView=useMemo(()=>{
417+
if(
418+
comp.children.hasOwnProperty('showMask')
419+
&&comp.children.hasOwnProperty('maskClosable')
420+
){
421+
returnuiCompRender;
422+
}
423+
returnuiCompRenderWithWrapper;
424+
},[comp.children]);
425+
426+
returnrenderView;
427+
},(prevProps,nextProps)=>{
428+
returnisEqual(prevProps,nextProps);
408429
});

0 commit comments

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