当前位置: 首页 > news >正文

uni-app - switchTab 跳转到 页面后不走onLoad,option无法更新 - MT

场景:tabbar页面是展示一个列表,页面中有一个搜索按钮,点击按钮进入搜索页面,输入字段以后返回tabbar页面展示相应的搜索结果,切换tabbar页面后搜索条件置空

方案1:使用navigateTo 跳转传值

坑1:因为搜索页要跳转的是tabbar页面,不能直接使用navigateTo 跳转,只能使用switchTab,但是switchTab不支持传参

方案2:使用reLaunch跳转传值

坑2:会清空路由栈,优化体验不太好,列表页的onshow周期接受不到传来的值,如果在onload接收后页面切换tabbar再回来就没有值了

搜索页:

uni.reLaunch({
url:'/pages/order/index?options='+options
})

方案3:使用$emit,$on传值

坑3:如果在列表页的onload或者onshow接受值以后,切换tabbar再回来以后值依然存在。之前想通过onTabItemTap周期来清空,发现只能监听本tabbar页面回来的时候,如果需要清空需要监听其他tabbar页面,比较麻烦,就选择了需要配合onhide周期置空传参接受的data值

搜索页:

uni.$emit('updateData', options)

uni.navigateBack({
delta: 1
})

列表页:

onShow(){

  uni.$on('updateData', data => {
this.waybillNo = data.waybillNo;
this.setOutVoucherNo = data.setOutVoucherNo;
this.truckNo = data.truckNo;
});

},

onHide() {
this.waybillNo = "";
this.setOutVoucherNo = "";
this.truckNo = "";
}

方案4:使用uni.setStorageSync传值

坑4:这样的方式在于什么时候清空传过来的值,判断比较多,pass

方案5:最后使用的方法

搜索页:

let pages = getCurrentPages();
let prevPage = pages[pages.length -2]
prevPage.$vm.getValue(options)
uni.navigateBack({
delta: 1
})

列表页:

methods里面加一个方法

getValue(options){
this.waybillNo = options.waybillNo;
this.setOutVoucherNo = options.setOutVoucherNo;
this.truckNo = options.truckNo;
},

然后在onHide周期进行置空

onHide() {
this.waybillNo = "";
this.setOutVoucherNo = "";
this.truckNo = "";
},

http://www.zskr.cn/news/64550.html

相关文章:

  • [1.1.1]b64steg
  • 初学markdown,typora
  • 电脑中显存和内存区别?
  • LAUNCH X431 PRO3 V+ ELITE: 10.1 Touchscreen, SmartLink 2.0, Full CAN 2.0/CANFD/DoIP/J2534 Support
  • 老六的字符串
  • 神奇的字符
  • mysql 迁移 达梦8.4
  • Day5-20251128
  • 问卷发了1000份,收回全是正确的废话?你少了一个读心指令
  • elasticsearch数据同步到hive
  • AI元人文:牛车新说
  • 揭秘金拓螺旋机厂家-螺旋式提升机核心供应商,高效稳定
  • 2025成都隔音窗厂家哪家好?优质隔音窗厂家清单请收好
  • AE跟踪面板
  • 2025年博客园快速发文的方法
  • 52
  • 2025年11月28日
  • 函数进阶
  • C++ 构造函数、析构函数
  • OEM K-008 BMW Motorcycle Key Adapter Cable: All Keys Lost Matching Ignition Programming
  • ubuntu无法执行二进制文件
  • FOC调试笔记
  • halo博客配置微软SSO指南
  • cmake编译stm项目提示“selected processor does not support `isb 0xF in ARM mode”
  • stm32f4 USB host无法解析hid键盘数据
  • React Zustand
  • 浙江网络舆情处置实战派大揭秘! 杭州本土企业都夸稳的5家王牌公司
  • 浙江网络舆情处置实战派大揭秘!杭州本土企业都夸稳的5家王牌公司
  • -2025/11/28
  • React事件处理