reactjs
SwitchTransition unexpected behavior
Hello everyone!.
I am currently working on a project in which I need to implement sequential transitions between pages. I came to the conclusion that I need to use Switch Transition. So, I created a couple of components that represent pages. Inside these components in the Render method, I create the Transition component and pass the props to it. Unfortunately, this does not work. Over the past 2 days, I read a bunch of articles on how to use response-transition-group, but in none of them I have found the use of such a good component as Switch Transition. I wrap my components in Switch Transition and then delete / add one by one with the change in the state of the parent (in my case <App /> final output structure is:
App
SwitchTransition
CustomComponent
Transition in={this.props.in}
// some jsx goes here
....
I use a react router but I did not insert it into the structure above, because I want to first understand how to use this component.
What is the current behavior?
The first component enters the tree. When the component is "removed" from the tree, animation occurs. Then after that I see in the developer’s tools that the SwitchTransition component has an infinite "entering" status
What is the expected behavior? Sequential animations of my components
