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

Commita00e634

Browse files
fixed modal z-index after optimisations
1 parenta621bdf commita00e634

File tree

2 files changed

+14
-10
lines changed

2 files changed

+14
-10
lines changed

‎client/packages/lowcoder-design/src/components/Modal/handler.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
importstyled,{css}from"styled-components";
2-
import{memo,useMemo}from"react";
2+
import{RefObject}from"react";
33

44
typeResizeHandleAxis="s"|"w"|"e"|"n"|"sw"|"nw"|"se"|"ne";
55
typeReactRef<TextendsHTMLElement>={
@@ -84,10 +84,9 @@ const ResizeHandle = styled.div<{ $axis: string }>`
8484
${(props)=>(["sw","nw","se","ne"].indexOf(props.$axis)>=0 ?CornerHandle :"")};
8585
`;
8686

87-
// Memoize Handle component
88-
constHandle=memo((axis:ResizeHandleAxis,ref:ReactRef<HTMLDivElement>)=>{
89-
return<ResizeHandleref={ref}$axis={axis}className="react-resizable-handle"/>;
90-
});
87+
constHandle=(resizeHandle:ResizeHandleAxis,ref:RefObject<HTMLDivElement>)=>{
88+
return<ResizeHandleref={ref}$axis={resizeHandle}className="react-resizable-handle"/>;
89+
};
9190

9291
Handle.displayName='Handle';
9392

‎client/packages/lowcoder/src/comps/hooks/modalComp.tsx‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { Layers } from "constants/Layers";
1414
import{HintPlaceHolder,Modal,Section,sectionNames}from"lowcoder-design";
1515
import{trans}from"i18n";
1616
import{changeChildAction}from"lowcoder-core";
17-
import{CSSProperties,useCallback,useMemo,useRef}from"react";
17+
import{CSSProperties,useCallback,useEffect,useMemo,useRef}from"react";
1818
import{ResizeHandle}from"react-resizable";
1919
importstyled,{css}from"styled-components";
2020
import{useUserViewMode}from"util/hooks";
@@ -118,6 +118,12 @@ let TmpModalComp = (function () {
118118
constappID=useApplicationId();
119119
constcontainerRef=useRef<HTMLElement|null>(null);
120120

121+
useEffect(()=>{
122+
return()=>{
123+
containerRef.current=null;
124+
};
125+
},[]);
126+
121127
// Memoize body style
122128
constbodyStyle=useMemo<CSSProperties>(()=>({
123129
padding:0,
@@ -171,11 +177,9 @@ let TmpModalComp = (function () {
171177

172178
// Memoize container getter
173179
constgetContainer=useCallback(()=>{
174-
if(!containerRef.current){
175-
containerRef.current=document.querySelector(`#${CanvasContainerID}`)||document.body;
176-
}
180+
containerRef.current=document.querySelector(`#${CanvasContainerID}`)||document.body;
177181
returncontainerRef.current;
178-
},[]);
182+
},[CanvasContainerID]);
179183

180184
// Memoize event handlers
181185
consthandleCancel=useCallback((e:React.MouseEvent)=>{
@@ -228,6 +232,7 @@ let TmpModalComp = (function () {
228232
mask={props.showMask}
229233
className={clsx(`app-${appID}`,props.className)}
230234
data-testid={props.dataTestIdasstring}
235+
destroyOnHidden
231236
>
232237
<InnerGrid
233238
{...props.container}

0 commit comments

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