Quiero la animación de retraso para otro elemento directamente por Vue Js, no css.
En este momento, Vue espera hasta que todos los elementos se hayan renderizado y todos aparezcan al mismo tiempo. ¿Cómo retrasar el cambio de this.animated = true
?
Artículo.vue
<template> <transition name="animation-fade"> <div v-if="this.animated"> {{this.itemProp.content}} </div> </transition> </template> <script> export default { name: 'Item', props: { itemProp: Object, }, data: function() { return { animated: false, loading: true, }; }, methods: { delayedShow: function(delay) { setTimeout(this.toggleItem, delay) }, }, toggleItem: function() { this.animated = true; }, mounted: function() { this.delayedShow(500); }, } </script>
Los elementos se definen en otro componente y cada paso por accesorio al modelo de elemento.
Ayudame por favor.