Sorry, what you mean "The GSAP instance could persist if there is a reference elsewhere in the code"?
util code:
import { gsap } from "gsap";
const startAnimation(elementClass, btnElClass){
const gsapTimeline = gasp.timeline();
gsapTimeline.fromTo(elementClass, {/* Some other codes */},{/* Some other codes */});
gsapTimeline.fromTo(elementClass, {/* Some other codes */}, {/* Some other codes */, onComplete: ()=>{
gsapTimeline.fromTo(btnElClass, {/* Some other codes */},{/* Some other codes */});
});
return gsapTimeline;
}
export { startAnimation };
ComponentA:
mounted: function () {
this.componentA = startAnimation('.component-a', '.btn-a');
},
beforeDestroy: function () {
this.componentA.kill();
}
ComponentC:
mounted: function () {
this.componentC = startAnimation('.component-c', 'btn-b');
},
beforeDestroy: function () {
this.componentC.kill();
}
So if I have something like this, does this count as "reference elsewhere in the code"?
sorry, first time using vuejs and gsap.