uni-app - switchTab 跳转到 页面后不走onLoad,option无法更新
<p>场景：tabbar页面是展示一个列表，页面中有一个搜索按钮，点击按钮进入搜索页面，输入字段以后返回tabbar页面展示相应的搜索结果，切换tabbar页面后搜索条件置空</p><p>方案1：使用 <code>navigateTo</code>跳转传值</p>
<p>坑1：因为搜索页要跳转的是tabbar页面，不能直接使用navigateTo 跳转，只能使用switchTab，但是switchTab不支持传参</p>
<p>方案2：使用reLaunch跳转传值</p>
<p>坑2：会清空路由栈，优化体验不太好，列表页的onshow周期接受不到传来的值，如果在onload接收后页面切换tabbar再回来就没有值了</p>
<p>搜索页：</p>
<p>uni.reLaunch({<br>
url:'/pages/order/index?options='+options<br>
})</p>
<p>方案3：使用$emit，$on传值</p>
<p>坑3：如果在列表页的onload或者onshow接受值以后，切换tabbar再回来以后值依然存在。之前想通过onTabItemTap周期来清空，发现只能监听本tabbar页面回来的时候，如果需要清空需要监听其他tabbar页面，比较麻烦，就选择了需要配合onhide周期置空传参接受的data值</p>
<p>搜索页：</p>
<p>uni.$emit('updateData', options)</p>
<p>uni.navigateBack({<br>
delta: 1<br>
})</p>
<p>列表页：</p>
<p>onShow(){</p>
<p> uni.$on('updateData', data => {<br>
this.waybillNo = data.waybillNo;<br>
this.setOutVoucherNo = data.setOutVoucherNo;<br>
this.truckNo = data.truckNo;<br>
});</p>
<p>},</p>
<p>onHide() {<br>
this.waybillNo = "";<br>
this.setOutVoucherNo = "";<br>
this.truckNo = "";<br>
}</p>
<p>方案4：使用uni.setStorageSync传值</p>
<p>坑4：这样的方式在于什么时候清空传过来的值，判断比较多，pass</p>
<p>方案5：最后使用的方法</p>
<p>搜索页：</p>
<p>let pages = getCurrentPages();<br>
let prevPage = pages<br>
prevPage.$vm.getValue(options)<br>
uni.navigateBack({<br>
delta: 1<br>
})</p>
<p>列表页：</p>
<p>methods里面加一个方法</p>
<p>getValue(options){<br>
this.waybillNo = options.waybillNo;<br>
this.setOutVoucherNo = options.setOutVoucherNo;<br>
this.truckNo = options.truckNo;<br>
},</p>
<p>然后在onHide周期进行置空</p>
<p>onHide() {<br>
this.waybillNo = "";<br>
this.setOutVoucherNo = "";<br>
this.truckNo = "";<br>
},</p><br><br>
来源：https://www.cnblogs.com/mt-joer/p/19284619
頁:
[1]