search

greensock / react

Tools for using GSAP in React, like useGSAP() which is a drop-in replacement for useLayoutEffect()/useEffect()
251 stars 7 forks source link

Toggling an animation based on a dependency #4

Closed RomainoSoko closed 7 months ago

RomainoSoko commented 9 months ago

Hello there !

I'm facing an issue when i'll try to make two differents animations depending of the state of my dependency, just like below :

image

The fact is that with this configuration, when my component is first rendered, the "out / disappearance" animation is triggered. So i've tryed to handle this case by adding a useRef called "firstRender", like below.

image

But ! It worked partially, because i could toggle my animation, but the disappearance transition have just broke up (working but without any transition, like if there was no duration option), while the appearing one is good.

Have you any idea of what is happening here ?

jackdoyle commented 9 months ago

Did you intend to check if (firstRender.current)? You only checked if (firstRender) there :)

If you still need help, please provide a minimal demo, like a Stackblitz or CodePen that clearly illustrates the problem, and post in the forums at https://gsap.com/community and we'd be happy to take a look. It's difficult to troubleshoot by just looking at a screenshot of an excerpt of code.