vue过渡动画若干问题

一、transition

transition中一个时间内只能有一个元素显示。有两个以及两个元素以上时，需要用v-if/v-else区别显示的条件。同时，元素需要绑定不同的key值。否则vue会复用元素，从而不能产生动画效果。

v-if的判断条件写在transition下面的子元素上。

二、transition-group

transition-group用于列表的过渡效果。一般与v-for一起用。如果只是单独在transition-group上或者transition-group的父元素上使用v-if判断，是不能产生过渡动画的。可以有两种方法：

1.改变循环列表元素的值

2.给每个transition-group下的元素加上v-if的条件判断。