Browse Source

fix: event cancelable bug

yangkaixuan 5 years ago
parent
commit
bc8aa78eda
1 changed files with 19 additions and 17 deletions
  1. 19 17
      src/packages/popup/popup.vue

+ 19 - 17
src/packages/popup/popup.vue

@@ -34,48 +34,48 @@ const overflowScrollReg = /scroll|auto/i;
 const popupProps = {
 const popupProps = {
   position: {
   position: {
     type: String,
     type: String,
-    default: 'center'
+    default: 'center',
   },
   },
 
 
   transition: String,
   transition: String,
 
 
   closeable: {
   closeable: {
     type: Boolean,
     type: Boolean,
-    default: false
+    default: false,
   },
   },
   closeIconPosition: {
   closeIconPosition: {
     type: String,
     type: String,
-    default: 'top-right'
+    default: 'top-right',
   },
   },
   closeIcon: {
   closeIcon: {
     type: String,
     type: String,
-    default: 'cross'
+    default: 'cross',
   },
   },
 
 
   closeOnClickOverlay: {
   closeOnClickOverlay: {
     type: Boolean,
     type: Boolean,
-    default: true
+    default: true,
   },
   },
 
 
   destroyOnClose: {
   destroyOnClose: {
     type: Boolean,
     type: Boolean,
-    default: false
+    default: false,
   },
   },
   getContainer: String,
   getContainer: String,
   round: {
   round: {
     type: Boolean,
     type: Boolean,
-    default: false
-  }
+    default: false,
+  },
 };
 };
 export default {
 export default {
   name: 'nut-popup',
   name: 'nut-popup',
   mixins: [touchMixins],
   mixins: [touchMixins],
   components: {
   components: {
-    icon: Icon
+    icon: Icon,
   },
   },
   props: {
   props: {
     ...overlayProps,
     ...overlayProps,
-    ...popupProps
+    ...popupProps,
   },
   },
   created() {
   created() {
     this.transition ? (this.transitionName = this.transition) : (this.transitionName = `popup-slide-${this.position}`);
     this.transition ? (this.transitionName = this.transition) : (this.transitionName = `popup-slide-${this.position}`);
@@ -111,19 +111,19 @@ export default {
       val === 'center' ? (this.transitionName = 'popup-fade') : (this.transitionName = `popup-slide-${this.position}`);
       val === 'center' ? (this.transitionName = 'popup-fade') : (this.transitionName = `popup-slide-${this.position}`);
     },
     },
     getContainer: 'portal',
     getContainer: 'portal',
-    overlay: 'renderOverlay'
+    overlay: 'renderOverlay',
   },
   },
   data() {
   data() {
     return {
     return {
       showSlot: true,
       showSlot: true,
       transitionName: 'popup-fade-center',
       transitionName: 'popup-fade-center',
-      overlayInstant: null
+      overlayInstant: null,
     };
     };
   },
   },
   computed: {
   computed: {
     transitionDuration() {
     transitionDuration() {
       return this.duration ? this.duration + 's' : 'initial';
       return this.duration ? this.duration + 's' : 'initial';
-    }
+    },
   },
   },
 
 
   methods: {
   methods: {
@@ -144,7 +144,7 @@ export default {
         overlayClass,
         overlayClass,
         overlayStyle,
         overlayStyle,
         lockScroll,
         lockScroll,
-        closeOnClickOverlay
+        closeOnClickOverlay,
       };
       };
 
 
       this.renderOverlay(config);
       this.renderOverlay(config);
@@ -178,7 +178,9 @@ export default {
       const { scrollHeight, offsetHeight, scrollTop } = el ? el : this.$el;
       const { scrollHeight, offsetHeight, scrollTop } = el ? el : this.$el;
 
 
       if ((this.deltaY > 0 && scrollTop === 0) || (this.deltaY < 0 && scrollTop + offsetHeight >= scrollHeight)) {
       if ((this.deltaY > 0 && scrollTop === 0) || (this.deltaY < 0 && scrollTop + offsetHeight >= scrollHeight)) {
-        event.preventDefault();
+        if (event.cancelable) {
+          event.preventDefault();
+        }
       }
       }
     },
     },
     getScroller(el) {
     getScroller(el) {
@@ -234,8 +236,8 @@ export default {
       if (container && container !== el.parentNode) {
       if (container && container !== el.parentNode) {
         container.appendChild(el);
         container.appendChild(el);
       }
       }
-    }
-  }
+    },
+  },
 };
 };
 export { popupProps };
 export { popupProps };
 </script>
 </script>