关于VUE transition标签搭配动画效果 闪动 上一标签还未退出完毕下一个就出来

场景：使用transition标签v-if或v-show搭配animate.css实现动画效果

解决如下问题

1. 闪动

2.上一标签还未退出完毕下一个就出来 

我发现这个问题过了4年居然没人回复解决办法，其他帖子也没人给个答案，我看了上面这个问题就摸出来了。

1.加mode="in-out" 或mode="out-int"

2.给你transition标签外在加一层div给上相对定位position：relative，给你控制显示隐藏的v-if或v-show标签加上position：absolute；width：100%；

注意：transition中只可包裹一个 想包裹多个用transition-grop；也就是我这边有两个transition标签

闪动的你们加mode就行了 vue官网有说明

我这里之说：上一标签还未退出完毕下一个就出来 如图

只给transition加position：absolute前

给transition外层div加相对定位，transition加绝对定位（相对与外层div），和加宽度width：100%（继承了外层div的宽度，样式自然没问题了），效果如下：

最终效果

 完美啦