[Vuejs]-Vuejs transition inside a for loop

0👍

The key here is to add the appear attribute on the transition tag to force Vue to apply the transition when it is initially rendered.

Here is a working example:
https://codesandbox.io/s/vue-template-rjmi9?fontsize=14&hidenavigation=1&theme=dark

You may need to click "refresh" in the IDE browser to see the transition. Depends on the speed in which your browser loads the IDE itself.

More information can be found at: https://v2.vuejs.org/v2/guide/transitions.html#Transitions-on-Initial-Render

You may also want to consider using <transition-group> depending on your needs. Info can be found here: https://v2.vuejs.org/v2/guide/transitions.html#List-Transitions

Leave a comment