Powered by md-Blog  文 - 篇  访客 -

Vue.js流畅过渡切换动画的实现


  分类:Vue  / 
更新:2020-11-01 17:25:27  /  创建:2020-04-01 11:15:51
不要删除

先看效果

demo

模板文件

<transition name="myfade">
    <router-view></router-view>
</transition>

样式文件

/* myfade  */
.myfade-enter, .myfade-leave-to {
    opacity: 0;
}
.myfade-leave, .myfade-enter-to {
    opacity: 1;
}
.myfade-enter-active {
    transition: opacity .5s;
    transition-delay: .3s;
}
.myfade-leave-active {
    transition: opacity .3s
}

不要删除

小站不易,感谢支持!