fix ant-design/ant-motion#404

Author: jljsj33

examples/scrollScreen.js

@@ -93,7 +93,7 @@ class Demo extends React.Component {
           <TweenOne className="tween-one" key="0" animation={{ opacity: 1 }}>
             每次进入都启动播放
           </TweenOne>
-          <QueueAnim key="1" style={{ height: 100 }}>
+          <QueueAnim key="1" style={{ height: 100, overflow: 'auto' }}>
             <div key="0" className="demo-content" />
             <div key="1" className="demo-content" />
             <div key="2" className="demo-content" />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rc-scroll-anim",
-  "version": "2.7.4",
+  "version": "2.7.5",
   "description": "scroll-anim anim component for react",
   "keywords": [
     "react",

src/ScrollOverPack.jsx

@@ -110,7 +110,7 @@ class ScrollOverPack extends ScrollElement {
       ...props
     } = this.props;
     if (windowIsUndefined) {
-      return createElement(component, { ...props, ...componentProps });
+      return createElement(component, { ...props, ...componentProps }, props.children);
     }
     let childToRender;
     if (!this.oneEnter) {

src/ScrollScreen.jsx

@@ -122,7 +122,7 @@ class ScrollScreenClass {
     return dom && document.defaultView && document.defaultView.getComputedStyle ?
       document.defaultView.getComputedStyle(dom) : {};
   }
-  isScroll = (dom) => {
+  isScroll = (dom, deltaY) => {
     const style = this.getComputedStyle(dom);
     const overflow = style.overflow;
     const overflowY = style.overflowY;
@@ -131,12 +131,15 @@ class ScrollScreenClass {
     // dom.parentNode === document 解决在滚动条上滚动取不到 body;
     if (dom === document.body || !dom || dom.parentNode === document) {
       return false;
-    } else if (dom.scrollHeight > dom.offsetHeight
-      && isScrollOverflow
-      && dom.scrollTop < dom.scrollHeight) {
+    } else if (
+      dom.scrollHeight > dom.offsetHeight && 
+      isScrollOverflow && 
+      dom.scrollTop + dom.offsetHeight + deltaY < dom.scrollHeight && 
+      dom.scrollTop + deltaY > 0
+    ) {
       return true;
     }
-    return this.isScroll(dom.parentNode);
+    return this.isScroll(dom.parentNode, deltaY);
   }
   limitNum = (min, max) => {
     if (this.vars.loop) {
@@ -148,11 +151,12 @@ class ScrollScreenClass {
     }
   }
   onWheel = (e) => {
-    e.preventDefault();
-    if (this.isScroll(e.target)) {
+    const deltaY = e.deltaY;
+    if (this.isScroll(e.target, deltaY)) {
       return;
     }
-    const deltaY = e.deltaY;
+    e.preventDefault();
+    
     const mapped = this.mapped;
     if (this.rafID === -1 && deltaY !== 0 && this.toHeight === -1) {
       const winHeight = windowHeight();