How to make popup blocks?

Question

Frontend

Hello, I started to learn react and ran into a problem. I have a list of categories and it is necessary that when you click on the selected category, a list of subcategories falls out, and, accordingly, when you click again, everything is hidden. I thought about making the subcategory display: none and display: block when the button was activated, but I couldn’t cope with adding the class. help me please

Answer 1

the display property is not animated,
If you do it manually, then first you start the animation using the class, and when the animation is over, remove it using conditional rendering, you need to use refs on the DOM element
https://reactjs.org/docs/refs-and-the-dom .html
and event
https://developer.mozilla.org/en-US/docs/Web/API/H...
But it's better to use this https://reactcommunity.org/react-transition-group/