ReactTransitionGroup: Is it possible to use SwitchTransition with ReactRouter to fix exit transitions using React Router <Switch>?

Question

I am experimenting with ReactTransitionGroup and ReactRouter. The problem is that exit transitions dont work.

according to RTG site: When using React Transition Group with React Router, make sure to avoid using the Switch component because it only executes the first matching Route. This would make the exit transition impossible to achieve because the exiting route will no longer match the current URL and the children function won't execute.

https://reactcommunity.org/react-transition-group/switch-transition

Is it possible to use SwitchTransition to fix this limitation by wrapping the CSSTransition (wrapping a switch) in a SwitchTransition?

Answer 1

Instead of defining the transition inside the Route, as suggested, you could define it on the link. By clicking on any link, the transition starts to the new route, and the current route exit.

It can be very trick to make, but there is a lib for that, react-tiger-transition.

Here is the demo from the documentation site:

(I'm the author).