我滚动行为加上路由过度效果之后,点击返回的滚动行为灭有用了。大神帮我看看什么问题,还是说我这里写的有问题 //html <transition :name="transitionName"> <router-view class="fadb"></router-view> </transition>
//js watch : { $route(to, from){ let isBack = this.$router.isBack if (isBack) { this.transitionName = ‘fade-back’;
} else {
this.transitionName = 'fade'
}
// 做完回退动画后,要设置成前进动画,否则下次打开页面动画将还是回退
this.$router.isBack = false
},
},
//style
.fade-enter-active, .fade-leave-active,.fade-back-enter-active, .fade-back-leave-active{
transition: transform 0.2s linear;
transform: translate(0%, 0);
}
.fade-leave-to,.fade-back-enter{transform: translate(-100%, 0);}
.fade-enter,.fade-back-leave-to {
transform: translate(100%, 0);
}
.fade-enter-active.fadb, .fade-leave-active.fadb,.fade-back-enter-to.fadb{
position: fixed;
width: 100%;
max-width: 375px;
height: 100%;
top:0;
background: #f1f1f1;
overflow:hidden;
}
.fade-enter.fadb, .fade-leave-to.fadb{
position: fixed;
top:0;
width: 100%;
height: 100%;
background:#f1f1f1;
overflow:hidden;
}
//路由 scrollBehavior (to,from,savedPosition){ return {x:1,y:0}; }