vue切换动画

在css设置样式代码如下：

.slide-fade{
  position: fixed;
  left:0;
  right: 0;
  width: 100%;
  background-color: white;
}
.slide-fade-enter, .slide-fade-leave-to
{
  left:0;
  top: 0;
  right: 0;
  position: absolute;
  transform:translateX(-500px) translateY(-500px) rotate(-150deg)             	scale(0.5);
  opacity:1;
}
.slide-fade-enter-active {
  background-color: white;
  transition: all 0.6s ease;
}
.slide-fade-leave-active {
  transition: all 1s ease;
  background-color: white;
  transform:translateX(500px) translateY(500px) rotate(150deg) scale(1) ;
  z-index: 100;
}
## 包裹router-view## 
 <transition name="slide-fade">
      <router-view/>
    </transition>