fix #134

Author: jljsj33

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rc-drawer",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "drawer component for react",
   "keywords": [
     "react",

src/DrawerChild.tsx

@@ -164,15 +164,16 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
     const differX = e.changedTouches[0].clientX - this.startPos.x;
     const differY = e.changedTouches[0].clientY - this.startPos.y;
     if (
-      currentTarget === this.maskDom ||
-      currentTarget === this.handlerDom ||
-      (currentTarget === this.contentDom &&
-        getTouchParentScroll(
-          currentTarget,
-          e.target as HTMLElement,
-          differX,
-          differY,
-        ))
+      (currentTarget === this.maskDom ||
+        currentTarget === this.handlerDom ||
+        (currentTarget === this.contentDom &&
+          getTouchParentScroll(
+            currentTarget,
+            e.target as HTMLElement,
+            differX,
+            differY,
+          ))) &&
+      e.cancelable
     ) {
       e.preventDefault();
     }
@@ -237,7 +238,7 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
   ) => {
     const { placement, levelMove, duration, ease, showMask } = this.props;
     // router 切换时可能会导至页面失去滚动条，所以需要时时获取。
-    this.levelDom.forEach(dom => {
+    this.levelDom.forEach((dom) => {
       dom.style.transition = `transform ${duration} ${ease}`;
       addEventListener(dom, transitionEnd, this.transitionEnd);
       let levelValue = open ? value : 0;
@@ -435,7 +436,7 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
   };
 
   private getCurrentDrawerSome = () =>
-    !Object.keys(currentDrawer).some(key => currentDrawer[key]);
+    !Object.keys(currentDrawer).some((key) => currentDrawer[key]);
 
   private getLevelDom = ({ level, getContainer }: IDrawerChildProps) => {
     if (windowIsUndefined) {
@@ -459,8 +460,8 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
         }
       });
     } else if (level) {
-      dataToArray(level).forEach(key => {
-        document.querySelectorAll(key).forEach(item => {
+      dataToArray(level).forEach((key) => {
+        document.querySelectorAll(key).forEach((item) => {
           this.levelDom.push(item);
         });
       });
@@ -555,7 +556,7 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
             className={`${prefixCls}-mask`}
             onClick={maskClosable ? onClose : undefined}
             style={maskStyle}
-            ref={c => {
+            ref={(c) => {
               this.maskDom = c as HTMLElement;
             }}
           />
@@ -568,13 +569,13 @@ class DrawerChild extends React.Component<IDrawerChildProps, IState> {
             width: isNumeric(width) ? `${width}px` : width,
             height: isNumeric(height) ? `${height}px` : height,
           }}
-          ref={c => {
+          ref={(c) => {
             this.contentWrapper = c as HTMLElement;
           }}
         >
           <div
             className={`${prefixCls}-content`}
-            ref={c => {
+            ref={(c) => {
               this.contentDom = c as HTMLElement;
             }}
             onTouchStart={

src/utils.ts

@@ -12,13 +12,15 @@ const transitionEndObject: {
   MozTransition: 'transitionend',
   OTransition: 'oTransitionEnd otransitionend',
 };
-export const transitionStr: string = Object.keys(transitionEndObject).filter(key => {
-  if (typeof document === 'undefined') {
-    return false;
-  }
-  const html = document.getElementsByTagName('html')[0];
-  return key in (html ? html.style : {});
-})[0];
+export const transitionStr: string = Object.keys(transitionEndObject).filter(
+  key => {
+    if (typeof document === 'undefined') {
+      return false;
+    }
+    const html = document.getElementsByTagName('html')[0];
+    return key in (html ? html.style : {});
+  },
+)[0];
 export const transitionEnd: string = transitionEndObject[transitionStr];
 
 export function addEventListener(
@@ -75,16 +77,22 @@ export const getTouchParentScroll = (
   differX: number,
   differY: number,
 ): boolean => {
-  if (!currentTarget || currentTarget === document || currentTarget instanceof Document) {
+  if (
+    !currentTarget ||
+    currentTarget === document ||
+    currentTarget instanceof Document
+  ) {
     return false;
   }
   // root 为 drawer-content 设定了 overflow, 判断为 root 的 parent 时结束滚动；
   if (currentTarget === root.parentNode) {
     return true;
   }
 
-  const isY = Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differY);
-  const isX = Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differX);
+  const isY =
+    Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differY);
+  const isX =
+    Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differX);
 
   const scrollY = currentTarget.scrollHeight - currentTarget.clientHeight;
   const scrollX = currentTarget.scrollWidth - currentTarget.clientWidth;
@@ -97,15 +105,16 @@ export const getTouchParentScroll = (
   const x = scrollX && overflowX;
 
   if (
-    (isY && (!y ||
-      (y && (
-        (currentTarget.scrollTop >= scrollY && differY < 0) ||
-        (currentTarget.scrollTop <= 0 && differY > 0)
-      )))) ||
-    (isX && (!x ||
-      (x && (
-        (currentTarget.scrollLeft >= scrollX && scrollX < 0) ||
-        (currentTarget.scrollLeft <= 0 && scrollX > 0)))))
+    (isY &&
+      (!y ||
+        (y &&
+          ((currentTarget.scrollTop >= scrollY && differY < 0) ||
+            (currentTarget.scrollTop <= 0 && differY > 0))))) ||
+    (isX &&
+      (!x ||
+        (x &&
+          ((currentTarget.scrollLeft >= scrollX && differX < 0) ||
+            (currentTarget.scrollLeft <= 0 && differX > 0)))))
   ) {
     return getTouchParentScroll(
       root,