uniapp学习笔记-transition过渡动画切换卡顿的问题

<template>
<view>
<u-transition :show="showIndex===0" mode="fade">
//主页
<button @click="goOne"></button>
<button @click="goTwo"></button>
</u-transition>

<u-transition :show="showIndex===1" :mode="zoomin">
分页面1
<button @click="goTwo"></button>
<button @click="backHome"></button>
</u-transition>

<u-transition :show="showIndex===2" :mode="zoomin">
分页面2	
<button @click="goOne"></button>
<button @click="backHome"></button>
</u-transition>
</view>
<template>
&lt;script&gt;
export default {
data(){
  return{
  showIndex:0
  }
},
methods:{
goOne(){
this.showIndex=1
},
goTwo(){
this.showIndex=2
},
backHome(){
this.showIndex=0
}
 }
}
&lt;/script&gt;

发现从主页跳转到1和2页面不存在动画卡顿,不过1和2之间切换存在卡顿,猜测可能是动画都是zoomin
个人探索的解决方法:
先切换到主页再跳转进分页面就不卡了
goOne(){
setTimeout(() => {
this.showIndex = 0
}, 0)
this.showIndex=1
},
goTwo(){
setTimeout(() => {
this.showIndex = 0
}, 0)
this.showIndex=2
},