路由过渡动画

路由过渡动画就是在切换路由的时候加点动画效果，这里就是把router-view用transition包起来，然后给他个name叫fade，然后fade有四个类名，就通过这四个类名给路由加动画即可，更酷炫的效果需要有css和js功底，当然也可以用插件，然后还有个mode属性,他只有两个值，一个是in-out一个是out-in顾名思义就知道什么意思了，这里我们用out-in更好看一点

1
2
3

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

.fade-enter {
  opacity:0;
}
.fade-leave{
  opacity:1;
}
.fade-enter-active{
  transition:opacity 0.5s;
}
.fade-leave-active{
  opacity:0;
  transition:opacity 0.5s;
}