vue的路由跳转过程页面呈现出淡入淡出的效果简单方法:
image首先我们到App.vue页面进行操作,
image然后我们复制以下css代码
<style>
*{
margin: 0 auto;
}
.fade-enter-active, .fade-leave-active {
transition: all .2s;
transform: translate(0px,0px);}
.fade-enter, .fade-leave-active {
opacity: 0;
transform: translate( -100%,0px);
}
</ style>
.fade-enter-active, .fade-leave-active {
transition: all .2s;
transform: translate(0px,0px);
}
.fade-enter, .fade-leave-active {
opacity: 0;
transform: translate(-100%,0px);
}
然后~~~~~搞定了 一个简单版的淡入淡出效果做完了
网友评论