fix: 修复 dialog 滚动失效问题 (#1130)

* fix: 修复 dialog 滚动失效问题 * fix: 修复 dialog 滚动失效问题
Tencent · Jul 2, 2022 · 991ae2c · 991ae2c
1 parent b6295e6
commit 991ae2c
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/src/_common b/src/_common
diff --git a/src/dialog/dialog.tsx b/src/dialog/dialog.tsx
@@ -202,7 +202,7 @@ export default defineComponent({
       }
     };
     const overlayAction = (e: MouseEvent) => {
-      if (props.closeOnOverlayClick ?? global.value.closeOnOverlayClick) {
+      if (props.showOverlay && (props.closeOnOverlayClick ?? global.value.closeOnOverlayClick)) {
         props.onOverlayClick?.({ e });
         emitCloseEvent({
           trigger: 'overlay',
@@ -283,14 +283,15 @@ export default defineComponent({
       return (
         // /* 非模态形态下draggable为true才允许拖拽 */
 
-        <div class={wrapClass.value}>
+        <div class={wrapClass.value} onClick={overlayAction}>
           <div class={positionClass.value} style={positionStyle.value}>
             <div
               key="dialog"
               class={dialogClass.value}
               style={dialogStyle.value}
               v-draggable={isModeLess.value && props.draggable}
               ref="dialogEle"
+              onClick={(e) => e.stopPropagation()}
             >
               <div class={`${COMPONENT_NAME.value}__header`}>
                 {getIcon()}
@@ -329,12 +330,11 @@ export default defineComponent({
       afterLeave,
       hasEventOn,
       renderDialog,
-      overlayAction,
     };
   },
   render() {
-    const { COMPONENT_NAME, overlayAction } = this;
-    const maskView = this.isModal && <div key="mask" class={this.maskClass} onClick={overlayAction}></div>;
+    const { COMPONENT_NAME } = this;
+    const maskView = this.isModal && <div key="mask" class={this.maskClass}></div>;
     const dialogView = this.renderDialog();
     const view = [maskView, dialogView];
     const ctxStyle = { zIndex: this.zIndex };