vue templates übergangsgruppen

Question

Als ich eine einfache Liste hatte, hatte ich Transitions, die jetzt funktionieren, ich benutze Komponenten und Vorlagen, der Übergang funktioniert nicht mehr ... Kann jemand erklären warum?

Ich möchte jedes Element animieren, während es scheint, alle Elemente in einem Übergang zu tun.

Ich verwende vue2.js

mein css

.flip-list-move { 
    transition: transform 1s; 
} 

Meine Auszeichnungs

 <div > 
<transition-group name="flip-list" tag="div" > 

       <div v-for="item in accFilters" class="box" v-bind:key="item" > 

        <h1>{{ item.name }}</h1> 
        <img :src="item.imageUrl" style="width:200px;"> 
        <p>{{item.extract}}</p> 
        {{ item.holidayType }} 

        <div is="task" v-for="avail in item.avail" v-bind:item="avail" > 

        </div>  


       </div> 
     </transition-group> 

     </div> 

    </template> 

Answer 1

Es es in einer Weise arbeitet scheint. .alle Artikel sind animiert das item