关于微信小程序wx.switchTab() 和wx.navigateBack()无法传递参数的两种解决方法

1.把参数保存在全局里

官方文档上写明无法传递参数,可以吧参数保存在全局上使用

解决方法如下:

//a.js
const app = getApp();
go_index:function(e){
//获取身份id 保存到全局里
var shenfen_id = e.currentTarget.id;
app.globalData.shenfen_id = shenfen_id       //把本页面需要传递的参数保存在全局上

wx.switchTab({
url: '/pages/index/index',
})
},


//index.js
onLoad: function (options) {
var that = this;
// 判断是哪一种身份进入的首页
var shenfen_id = app.globalData.shenfen_id     //从全局里获取需要的参数

if (shenfen_id==1){
that.setData({
h_show:false
})
}
else{
that.setData({
h_show: true
})
}


2.把参数保存在本地

解决方法如下:

//b.js
back:function(e){
var that = this;
var value = e.currentTarget.dataset.concent;      //把本页面需要传递的参数保存在本地缓存里
wx.setStorageSync('concent', value);

wx.navigateBack({                                           //返回上一级页面页面c页面
delta: 1,
})

},

//c.js
onShow: function () {
var that = this;
// this.onLoad();
var value = wx.getStorageSync('concent');        //从本地缓存获取需要的参数

if (tittle_name == "选择学校") {
that.setData({
value: value,
})
}
else {
that.setData({
value1: value,
})
}

},

<think>嗯,用户问的是微信小程序wx.switchTab方法不支持queryString的原因解决方法。首先,我得回忆一下微信小程序的文档内容。记得switchTab是用来跳转到tabBar页面的,而tabBar页面是小程序底部的固定标签页。根据文档,这些页面在切换时可能会有不同的处理方式,比如预加载或者保持状态。可能这就是为什么不允许带query参数的原因,因为tabBar页面在初始化后可能不会被重新加载,导致参数无法传递。 然后,用户的引用内容提到,当使用变量作为url时会出现错误,比如链接里有参数的话,就会报错。比如跳转到pages/goods/index/index?ishot=1,但实际上参数会被忽略,只跳转到pages/goods/index/index。用户还提到社区里的解决方法,比如使用全局变量或者本地存储来传递参数,比如uni.setStorageSync或者app.globalData。 接下来,我需要整理这些信息,找出根本原因。可能微信官方在设计tabBar页面时,为了性能优化,限制了参数传递,因为每次切换tabBar页面时,页面可能不会被销毁重新创建,所以带参数的话可能导致状态不一致或者安全问题。此外,tabBar页面的加载时机可能与其他页面不同,无法实时处理参数。 然后,解决方法方面,用户提到的几种方法:全局变量、本地存储、事件通知、通过其他页面中转。这些方法各有优缺点。全局变量可能在页面刷新或重新进入时失效,本地存储则更可靠,但需要处理读取时机,比如在onShow生命周期里获取。事件通知可能适合组件间通信,而通过非tabBar页面中转,比如先用navigateTo传递参数,再在目标页面里使用switchTab,这样可以绕过限制。 还需要考虑不同框架如uni-app的处理方式,用户引用里提到uni-app中的解决方法是使用存储,比如uni.setStorageSync。这可能是因为uni-app在编译成小程序时,处理路由的方式有所不同,但底层限制依然存在,所以同样需要这些变通方法。 最后,要总结这些解决方案,并指出官方限制的原因,比如性能优化框架设计。同时提醒用户注意事项,比如生命周期参数时效性,避免出现数据不同步的问题。可能还要比较不同方法的适用场景,帮助用户选择最合适的方案。</think>### 微信小程序中 `wx.switchTab` 不支持 queryString 的原因及解决方案 #### 原因分析 1. **框架设计限制** `wx.switchTab` 是微信小程序中用于跳转至 tabBar 页面的接口。根据官方文档,tabBar 页面在初始化时会预加载并保持常驻内存,**不支持通过 URL 传递动态参数**,因为 tabBar 页面切换时不会触发重新加载或初始化过程[^1][^2]。 2. **性能优化考量** tabBar 页面通常作为核心导航入口,若允许动态参数传递,可能导致频繁的页面重建,影响性能[^4]。 3. **安全限制** 禁止 queryString 可减少因参数注入导致的安全风险[^5]。 --- #### 解决方案 以下为绕过限制的常用方法: ##### 方法1:全局变量存储 ```javascript // 跳转前存储参数 const app = getApp(); app.globalData.selectedParams = { ishot: 1 }; wx.switchTab({ url: '/pages/goods/index/index' }); // 目标页面获取参数 Page({ onShow() { const params = getApp().globalData.selectedParams; console.log(params.ishot); // 输出1 } }); ``` ##### 方法2:本地缓存 ```javascript // 跳转前存储 uni.setStorageSync('selectedLabel', '热门商品'); // 目标页面读取 onShow() { const label = uni.getStorageSync('selectedLabel'); } ``` ##### 方法3:事件通知机制 通过 `EventChannel` 或全局事件总线传递参数: ```javascript // 通过 navigateTo 中转传递参数 wx.navigateTo({ url: '/pages/transfer', success(res) { res.eventChannel.emit('transferParams', { ishot: 1 }); } }); // /pages/transfer 页面接收后跳转 const eventChannel = this.getOpenerEventChannel(); eventChannel.on('transferParams', (data) => { wx.setStorageSync('params', data); wx.switchTab({ url: '/pages/target' }); }); ``` ##### 方法4:非 tabBar 页面中转 通过普通页面(非 tabBar)作为参数传递中介: ```javascript wx.navigateTo({ url: '/pages/transfer?ishot=1' }); // /pages/transfer 页面 onLoad(options) { wx.setStorageSync('params', options); wx.switchTab({ url: '/pages/target' }); } ``` --- #### 注意事项 1. **生命周期差异** tabBar 页面的 `onLoad` 仅在首次加载时触发,后续切换仅触发 `onShow`[^3]。 2. **参数时效性** 需在目标页面的 `onShow` 中及时读取存储的参数,避免数据过期。 3. **框架适配** uni-app 等跨端框架需使用 `uni.switchTab`,但底层限制相同[^3][^5]。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值