尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

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

uni-app - switchTab 跳转到 页面后不走onLoad,option无法更新 - MT
📅 发布时间:2026/6/19 16:43:53

场景: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 = "";
},

相关新闻

  • [1.1.11]Shellcode
  • .net core 2.1 mysql 8.0 迁移到 达梦8.4
  • MySQL 存储过程事务和锁

最新新闻

  • 宁波各区黄金回收测评 鄞州/海曙/江北变现哪家不压价 - 逸程
  • 2026深圳三大商圈黄金回收实测,逸程验金标准统一靠谱 - 逸程
  • K2.5技术解析:动态稀疏注意力与原生多模态架构
  • 2026杭州黄金回收避坑|认准商圈备案认证门店,杜绝虚高引流、到店压价 - 薛定谔的梨花猫
  • 石家庄黄金回收正规军在哪?2026实测门店星级榜,卖金前看一眼 - 奢侈品回收测评
  • 深度学习进阶(三十一)FlashAttention:IO 感知的精确注意力

日新闻

  • 5分钟掌握Python进化算法:Geatpy高性能优化工具完全指南
  • Microchip 24AA044 EEPROM选型与应用全指南:从参数解析到实战编程
  • 华为的鸿蒙到底有多牛?为什么称作遥遥领先?

周新闻

  • 3步解锁iOS设备:applera1n激活锁绕过完全指南
  • 39 2026 人工智能证书终极盘点,普通人选 AI 证书可以从这些方向入手
  • Redis 暴露公网有多危险?从端口检查到补救步骤

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号