Fix to work enter animation with CSSTransitionGroup

reactjs · Feb 9, 2017 · 2ad8818 · 2ad8818
1 parent f00acae
commit 2ad8818
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/src/CSSTransitionGroupChild.js b/src/CSSTransitionGroupChild.js
@@ -125,6 +125,11 @@ class CSSTransitionGroupChild extends React.Component {
   flushClassNameAndNodeQueue() {
     if (!this.unmounted) {
       this.classNameAndNodeQueue.forEach((obj) => {
+        // This is for to force a repaint,
+        // which is necessary in order to transition styles when adding a class name.
+        /* eslint-disable no-unused-expressions */
+        obj.node.scrollTop;
+        /* eslint-enable no-unused-expressions */
         addClass(obj.node, obj.className);
       });
     }
@@ -165,6 +170,7 @@ class CSSTransitionGroupChild extends React.Component {
     delete props.appearTimeout;
     delete props.enterTimeout;
     delete props.leaveTimeout;
+    delete props.children;
     return React.cloneElement(React.Children.only(this.props.children), props);
   }
 }