路由的过渡动画

app.vue

<transition name="fade" mode="out-in" >
<router-view></router-view>
</transition>

<style>

.fade-enter{
opacity: 0;
}
.fade-enter-active{
transition:opacity .5s;
}
.fade-leave{
opacity: 1;
}
.fade-leave-active{
opacity: 0;
transition:opacity .5s;
}
</style>

原文地址:https://www.cnblogs.com/zhouyx/p/7447974.html