.thumb.jpg.45ad1f0654d8c8cd759c47599fe1796d.jpg)
Can't use data property to Trigger gsap F.L.I.P change
I'm playing around with the GreenSock F.L.I.P plugin and Vue.Js and i stumble on an issue
I tried changing the layout with a data property in VueJs instead of a class toggle
But I don't know if it could works and why what I have done doesn't
Could someone explain why is it so ?
See the Pen MWpxEXm by FreeStab (@FreeStab) on CodePen
Hi Charles!
Changes in frameworks are done asynchronously so updates can get batched together. So you need to wait for the DOM to render those changes.
https://vuejsdevelopers.com/2019/01/22/vue-what-is-next-tick/
this.flexClass = !this.flexClass;
this.$nextTick(() => {
Flip.from(state, {
absolute: true,
duration: 0.5,
stagger: 0.05,
ease: "power1.inOut"
});
});
