From e7f53c59a0e0951da4a05c38a185bb6809542f7e Mon Sep 17 00:00:00 2001
From: pengsl <18718574603@163.com>
Date: Wed, 23 Feb 2022 23:27:47 +0800
Subject: [PATCH] =?UTF-8?q?fix(dialog):=20=E5=A4=9A=E4=B8=AA=E5=BC=B9?=
 =?UTF-8?q?=E7=AA=97=E5=85=B3=E9=97=AD=E4=B8=80=E4=B8=AA=E5=90=8E=E5=87=BA?=
 =?UTF-8?q?=E7=8E=B0=E6=BB=9A=E5=8A=A8=E6=9D=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

多个弹窗关闭一个后出现滚动条

fix #382
---
 src/dialog/RenderDialog.tsx | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/dialog/RenderDialog.tsx b/src/dialog/RenderDialog.tsx
index 7d9be9f3d..9f278e9cc 100644
--- a/src/dialog/RenderDialog.tsx
+++ b/src/dialog/RenderDialog.tsx
@@ -52,6 +52,7 @@ const RenderDialog: React.FC<RenderDialogProps> = (props) => {
   const bodyCssTextRef = useRef<string>();
   const isModal = mode === 'modal';
   const canDraggable = props.draggable && mode === 'modeless';
+  const dialogOpenClass = `${prefixCls}__open`;
 
   useEffect(() => {
     bodyOverflow.current = document.body.style.overflow;
@@ -81,9 +82,12 @@ const RenderDialog: React.FC<RenderDialogProps> = (props) => {
         wrap.current.focus();
       }
     } else if (isModal) {
-      document.body.style.cssText = bodyCssTextRef.current;
+      const openDialogDom = document.querySelectorAll(`.${dialogOpenClass}`);
+      if (openDialogDom.length < 1) {
+        document.body.style.cssText = bodyCssTextRef.current;
+      }
     }
-  }, [preventScrollThrough, attach, visible, mode, isModal]);
+  }, [preventScrollThrough, attach, visible, mode, isModal, dialogOpenClass]);
 
   useEffect(() => {
     if (visible) {
@@ -101,7 +105,10 @@ const RenderDialog: React.FC<RenderDialogProps> = (props) => {
     }
     if (isModal && preventScrollThrough) {
       // 还原body的滚动条
-      isModal && (document.body.style.overflow = bodyOverflow.current);
+      const openDialogDom = document.querySelectorAll(`.${dialogOpenClass}`);
+      if (isModal && openDialogDom.length < 1) {
+        document.body.style.overflow = bodyOverflow.current;
+      }
     }
     if (!isModal) {
       const { style } = dialog.current;
@@ -262,7 +269,12 @@ const RenderDialog: React.FC<RenderDialogProps> = (props) => {
     };
 
     const dialogBody = renderDialog(`${props.placement ? `${prefixCls}--${props.placement}` : ''}`);
-    const wrapClass = classnames(props.className, `${prefixCls}__ctx`, `${prefixCls}__ctx--fixed`);
+    const wrapClass = classnames(
+      props.className,
+      `${prefixCls}__ctx`,
+      `${prefixCls}__ctx--fixed`,
+      visible ? dialogOpenClass : '',
+    );
     const dialog = (
       <div ref={wrap} className={wrapClass} style={wrapStyle} onKeyDown={handleKeyDown}>
         {mode === 'modal' && renderMask()}