If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/m4mb9Lg3/4/).
When I wrap an routered component in CSSTransition , and when router has changed , the component which in Route will unmount twice:
<TransitionGroup>
<CSSTransition key={currentKey}
timeout={timeout}
unmountOnExit={true}
mountOnEnter={true}
classNames="fade">
<section className="routes-container-section">
<Switch>
{
routes.map(
(route,i)=><Route {...route} key={"route_"+i}/>
)
}
</Switch>
</section>
</CSSTransition>
</TransitionGroup>
For anyone experiencing this, add exit={false} to <CSSTransition>
Add location props to <CSSTransition location={location} /> resolve my problem.
Most helpful comment
For anyone experiencing this, add
exit={false}to<CSSTransition>