search

vuejs / vue

This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core
http://v2.vuejs.org
MIT License
207.71k stars 33.68k forks source link

The callback "done" doesn't work correctly in transition. #8703

Closed IPospelova closed 6 years ago

IPospelova commented 6 years ago

Version

2.5.17

Reproduction link

https://codepen.io/anon/pen/WgQpNd

Steps to reproduce

  1. The callback done doesn't work. When click on step, the animation on the next step, start before animation end on previous step.(check the link https://codepen.io/anon/pen/WgQpNd)
  2. Why after click on step and animation end of the first step, it still visible on the screen (v-if="step === 1", but data step changed to value 2)

What is expected?

I expected, when you click on step is to see animation step by step, becouse i use callback done. (animation on step 2 start after animaiton on step 1 is completly)

What is actually happening?

  1. The animation is overlay of each other.
  2. After animation end, and data for v-if changed elements still visible on the screen

Please tell me this is a bug, or am I do something doing wrong :)

posva commented 6 years ago

For some reason, Velocity is not calling the done callback. This is pretty much a question disguised as an issue 😛 If you want only one to be visible make sure to put everything under the same transition and change the mode to out-in

Please, next time consider using the forum, the Discord server or StackOverflow for questions first. But feel free to come back and open an issue if it turns out to be a bug 🙂

IPospelova commented 6 years ago

Hello Eduardo :) Look i wrote on forum but nobody answer :( I check once again use GreenSock (GSAP) - https://codepen.io/anon/pen/qMOGKV with mode="out-in" But the problem still here, next animation start before previous end, please give me a minute of your work time, and little help me :)