.transitionBody{
position: absolute;
top: 0;
width: 100%;
transition: all 0.3s ease; /*定义动画的时间和过渡效果*/
}
.transitionLeft-enter,
.transitionRight-leave-active {
-webkit-transform: translate(100%, 0);
transform: translate(100%, 0);
/*当左滑进入右滑进入过渡动画*/
}
.transitionLeft-leave-active,
.transitionRight-enter {
-webkit-transform: translate(-100%, 0);
transform: translate(-100%, 0);
}
js判断部分
watch: {
$route (to, from){
const arr = [‘myFans‘,‘forgetPwd‘,‘dtIncome‘, ‘jtIncome‘];
const compare = arr.indexOf(to.name)>arr.indexOf(from.name);
this.transitionName = compare ? ‘transitionLeft‘ : ‘transitionRight‘;
}
},
