reactjsreact-routertypeerrorcss-transitionsreactcsstransitiongroup

React 18 + CSSTransition makes error : TypeError: Cannot read properties of undefined (reading 'baseVal')


I am getting an error when animating routes switching using CssTransition, I can’t find anything useful on the Internet about this problem. Maybe someone here can give some advice. Thanks!

react : 18.2.0
react-router-dom: 6.4.0
react-transition-group": 4.4.5

The problem is only when switching to the case/:id route and not regularly, also if you manually reload the page with an error, it will load without an error, all other routes work correctly, the switching animation works as it should. I have an assumption that this is due to the fact that the page does not have time to render, but I don’t know how to solve this problem, even if this is the case.

enter image description here code enter image description here


Solution

  • I found solution here, i changed my routing as in example

    http://reactcommunity.org/react-transition-group/with-react-router