<template>
<div>
<transition :name="transitionName" @afterLeave="afterLeave">
<keep-alive>
<router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
</transition>
<transition :name="transitionName" @afterLeave="afterLeave">
<router-view v-if="!$route.meta.keepAlive" class="child-view"></router-view>
</transition>
</div></template> watch: {
$route(to, from) { let toLevel = to.meta.level; let fromLevel = from.meta.level; this.transitionName = toLevel>fromLevel?'slide-left':'slide-right'
this.has = toLevel>fromLevel?false:true //判斷
}
}如上述代碼 只在router-view 進(jìn)行了v-if判斷 所以會存在兩個transition如果在 keepalive 上加 v-if 判斷 組件就不會緩存 如果在 transition加入判斷 頁面就不會顯示應(yīng)該在哪里判斷 又或者如何處理 ?求幫忙?。。?
vue keepalive 配合 transition 動畫會重疊
慕蓋茨4494581
2018-12-16 17:17:30