vue过渡效果

　　vue过渡效果。

 

    <transition name='slide-fade'>
      <div class="top" @click='gotoTop' v-if='showTop'>
        <img src="../assets/img/top.png" alt="">
      </div>
    </transition>

 

 

  .slide-fade-enter-active {
    transition: all .3s ease;
  }
  .slide-fade-leave-active {
    transition: all .3s cubic-bezier(1.8, 0.1, 0.5, 1.0);
  }
  .slide-fade-enter, .slide-fade-leave-active {
    transform: translateY(1.5rem);
    opacity: 0;
  }