微信小程序wx.switchTab传参问题

最新推荐文章于 2025-05-01 18:29:10 发布
最新推荐文章于 2025-05-01 18:29:10 发布
阅读量6.2w 收藏 21
点赞数 20
分类专栏： 小程序 文章标签： switch传参 微信小程序switch tabar传参问题 switch
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/ly2983068126/article/details/79931409
版权
本文介绍了一种解决微信小程序中使用switchTab跳转时无法传递参数的问题的方法。通过设置全局变量的方式，在跳转前后页面间共享信息，使得目标页面能够根据全局变量的状态展示相应的内容。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

今天遇到一个功能，从其他页面（暂定为b.wxml页）跳转到首页（actList.wxml），需要传一个参数，从而判断显示的内容

在b.js中我是这样写的


按照上面写的在actList.js里得不到数据;


然后我去查看了下官方文档.

由此可见，switch是不能添加参数的。

可以换一种思路，跳转页面的时候传参，是为了有个标识，是为了下一个页面更方便的展示信息。我们可以在switch跳转之前设置一个全局变量，到下一个页面的时候，直接去获取全局变量

在b.js中:


在actList.js中:


这样就可以实现switch不能传参的弊端了。


如果有问题，希望大家提出来，我会随时改正更新的。

微信小程序/uni-app tabBar 页面传参问题
彭世瑜的博客
06-21 2002
先看下他们的文档1、微信小程序需要跳转的 tabBar 页面的路径 (代码包路径)（需在 app.json 的 tabBar 字段定义的页面），路径后不能带参数。2、uni-app需要跳转的 tabBar 页面的路径（需在 pages.json 的 tabBar 字段定义的页面），路径后不能带参数那么问题来了，我从tabA跳转到tabB怎么传参呢？
【微信小程序】常见问题-解决tabBar不能传参的问题
墨夶的博客
11-26 667
tabBar微信小程序支持自定义tabBar，你可以通过自定义组件来实现tabBar的跳转逻辑，并在跳转时传递参数。通过上述方法，你可以有效地解决微信小程序中tabBar页面跳转不能传递参数的问题。选择哪种方法取决于你的具体需求和应用场景。希望这些方法能帮助你更好地管理页面跳转逻辑，提升用户体验。
解决微信小程序使用switchTab传参以及跳转后页面不刷新的问题
red_paper_zj的博客
06-17 1438
可先在app.js里定义一个全局变量。 globalData:{ arguments: null } 然后在点击事件里改变全局变量。 toTabPage(e){ let arg = e.currentTarget.dataset.arg; getApp().globalData.arguments = arg; wx.switchTab({ url:url }) } 在tab页面的onLoad或者onShow事件里获取全局变量 onLoad(){ let a
关于微信小程序wx.switchTab的问题
03-29
昨天做了个功能要从首页跳到tabBar页,并且要带上参数.首先我是这样做的:  在index.js中:   toCategory:function(event){ var cate_id = event.currentTarget.dataset.cate_id; wx.switchTab({ url: '../category/category?cate_id='+cate_id, }); }, 按照上面写的在category.js里得不到数据;   onLoad:function(options){ console.log(options); } 然后查看了下官方文档.  wx.switc
uniapp switchtab 如何传参并接收参数
最新发布
深漂小码哥
05-01 804
在跳转前存储数据： 在目标页面获取数据： 在跳转前存储数据： 在目标页面获取数据： 在 中定义全局变量： 跳转前设置参数： 目标页面获取参数：
微信小程序：wx.switchTab传值和跳转
Janson_Lin
09-14 5156
微信小程序有多种页面跳转以及传值方式。 官方给出了navigateTo / redirectTo / switchTab / navigateBack / reLaunch ，这五种方式，其中navigateTo这个我有一篇博文中有讲到。我们今天就讲讲这个switchTab，剩下几个，后面在进行讲解。 我们还是按照惯例，查看官方的文档，这里提到，跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面，也就是使用了其他方式跳转的页面会被关闭，直接打开tabBar 页面，这里还有一个坑就是
微信小程序switchTab传参以及接收参数
热门推荐
Ghjkku的博客
07-23 13万+
我们可以在switch跳转之前设置一个全局变量，到下一个页面的时候，直接去获取全局变量。index.js保存参数先。contact.js获取参数。这样的传参方式是不行的。
小程序switchTab之间传参
挚友阳光的博客
12-29 1689
小程序switchTab之间传参
微信小程序开发系列（三十一）·页面跳转API（wx.navigateTo、wx. redirectTo、wx.switchTab、wx.reLaunch、wx.naviga）以及如何进行参数传递
时光の尘的博客
03-14 9070
分隔，例如：path?key=value&key2=value2 参数需要在跳转到的页面的 onLoad 钩子函数中通过形参进行接收。关闭（销毁）当前页面，跳转到应用中其他页面，不能跳转到tabBar页面。保留当前页面，跳转到应用中其他页面，不能跳转到 tabBar 页面。保留当前页面，跳转到 tabBar 页面，不能跳转到应用中其他页面。也可以在跳转到的页面的 onLoad 钩子函数中通过形参进行接收。如何返回多级页面呢？关闭当前页面，返回上一页或者返回多级页面，默认返回上一页。
微信小程序开发：路由跳转以及传参的使用详情
全沾软贱开发攻城狮
04-15 1万+
微信小程序开发中的大部分知识点和前端开发是一模一样的，就算具体的语法不一样，但是套路都是一样的，可以说微信小程序开发和前端开发使用的知识点基本一致。本篇博文就来分享一下在微信小程序开发中必用的知识点——路由，微信小程序中的路由使用原理和前端JS的路由使用类似，只是具体的使用语法不一样罢了。微信小程序的路由和前端JS的路由性质是一样的，根据路由规则（路径）从一个界面跳转到另外一个界面的规则。
uniapp微信小程序 页面跳转传参（uni.switchTab传参无法获取,uni.reLaunch传参可以获取）
weixin_69344090的博客
04-12 2031
因为是tab页面，我首先想到的就是通过：uni.switchTab进行页面跳转。结果uni.switchTab跳转的页面是不能够将路由参数传递到页面中的。生命周期函数中进行监听路由参数。这样就可以拿到路由中的参数了。
【微信小程序】解决wx.switchTab不能传递参数问题
weixin_62374100的博客
08-07 158
解决方法： 1：使用wx.setStorage()向本能存储里面存储要传递的数据 2：借用app对象传递全局参数 // 1.在app.js中定义要传递的全局参数 App({ globalData: { userInfo:{} } }) // 2.在login页面success返回中设置 const app=getApp() app.globalData...
解决wx.switchTab传参问题
limmt2020的博客
03-28 1373
解决wx.switchTab传参问题 如图所示在微信小程序中，通过跳转切换tab页时，是不能带参数的。 我们可以用全局变量传值的方法 前一个页面js中： var app = getApp() getApp().userid=aa, wx.switchTab({ url:'../index/index' }) 后一个页面onload中，我取的是userid的值。 onLoad: function (options) { console.
微信小程序 —— wx.switchTab不能携带参数问题
月来better
08-13 1140
今天在修复小程序问题中，当时忘记wx.switchTab不能够携带参数，尴尬当时以为能接受到参数，就一顿操作，然后最可恶的是自以为是的，能接收到数据，还没有打印输出验证，可恶。以后切记严谨行事！ 既然wx.switchTab中的url不能携带参数，但是又需要在跳转根据其参数去处理跳转页逻辑判断。那该如何处理呢？好办，那就借助app.js中的globalData数据去处理 app.js: App({ globalData:{ curDeviceNoDataStastus:false } })
小程序关于switchTab不能传参的问题，想自学前端的速来
03-21 2591
小编的一位同事在校期间连续三年参加ACM-ICPC竞赛。从参赛开始，原计划每天刷一道算法题，实际上每天有时候不止一题，一年最终完成了 600+：凭借三年刷题经验，他在校招中很快拿到了各大公司的offer。入职前，他把他的刷题经验总结成1121页PDF书籍，作为礼物赠送给他的学弟学妹，希望同学们都能在最短时间内掌握校招常见的算法及解题思路。整本书，我仔细看了一遍，作者非常细心地将常见核心算法题和汇总题拆分为4个章节。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
（转）微信小程序wx.switchTab传参解决办法
CaseyWei
04-19 1993
今天遇到一个功能，从其他页面（暂定为b.wxml页）跳转到首页（actList.wxml），需要传一个参数，从而判断显示的内容 在b.js中我是这样写的 按照上面写的在actList.js里得不到数据; 然后我去查看了下官方文档. 由此可见，switch是不能添加参数的。 可以换一种思路，跳转页面的时候传参，是为了有个标识，是为了下一个页面更方便的展示信息。我们可以在swit...
微信小程序内的跳转及参数传参
qq_38572963的博客
01-18 900
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
wx.switchTab 和wx.navigateTo有什么区别
04-23
<think>好的，我现在要回答用户关于微信小程序中wx.switchTab和wx.navigateTo的区别的问题。首先，我需要回忆这两个API的基本功能，以及它们的用法和限制。根据用户提供的引用内容，特别是引用[1]和[2]，可以知道： wx.navigateTo是保留当前页面并跳转到新页面，不能跳转到tabBar页面，而wx.switchTab则是专门跳转到tabBar页面，并且会关闭其他非tabBar页面。此外，用户提到的引用[3]指出，wx.switchTab无法直接传递参数，需要通过全局变量处理，而wx.navigateTo可以在URL中带参数。引用[4]的例子展示了wx.navigateTo和navigateBack的使用。 接下来需要整理两者的主要差异点，包括页面栈管理、跳转限制、参数传递、使用场景等。同时要注意用户可能关心的实际开发中的常见问题，比如如何传参，页面栈的变化等。 需要确保回答结构清晰，分点说明，并且结合用户提供的引用内容进行引用标注。例如，在提到参数传递时引用[3]，在页面栈处理时引用[1]和[4]。 最后，生成相关问题，帮助用户进一步理解。可能的问题包括其他跳转API的区别，传参的最佳实践，页面栈管理等。</think>### wx.switchTab 与 wx.navigateTo 的功能差异及使用场景 #### 一、核心区别 1. **页面栈管理** - `wx.navigateTo`：**保留当前页面**，将新页面压入页面栈。例如从页面A跳转到页面B后，可通过返回键回到A[^1]。 - `wx.switchTab`：**关闭所有非tabBar页面**，仅保留目标tabBar页面。例如从普通页面跳转到首页tab时，页面栈会被清空[^1][^4]。 2. **跳转限制** - `wx.navigateTo`：**不能跳转到tabBar页面**，仅适用于普通页面跳转[^1][^2]。 - `wx.switchTab`：**专门用于跳转tabBar页面**，如首页、分类页等底部导航栏页面[^3]。 3. **参数传递** - `wx.navigateTo`：可通过URL直接传参，如 `url: 'pageB?id=1'`[^2][^4]。 - `wx.switchTab`：**不支持URL传参**，需通过全局变量（如`app.globalData`）或本地存储传递数据[^3]。 4. **页面层级** - `wx.navigateTo`：可连续跳转多层（小程序默认最多10层）。 - `wx.switchTab`：跳转后页面栈仅保留目标tab，层级重置。 --- #### 二、使用场景对比 | **场景** | wx.navigateTo | wx.switchTab | |------------------------|-----------------------------------|----------------------------------| | 商品详情页跳转 | ✅ 保留商品列表页，便于返回 | ❌ 不适用 | | 从普通页返回首页tab | ❌ 无法跳转tabBar页面 | ✅ 关闭所有页面，直达首页 | | 需要传递参数 | ✅ 通过URL直接附加参数 | ❌ 需借助全局变量[^3] | | 多步骤流程（如下单） | ✅ 保持流程页面栈 | ❌ 中断流程 | --- #### 三、代码示例 1. **wx.navigateTo** ```javascript // 从页面A跳转到页面B并传参 wx.navigateTo({ url: '/pages/B/B?id=123' }); // 页面B通过onLoad获取参数 onLoad(options) { console.log(options.id); // 输出123 } ``` 2. **wx.switchTab** ```javascript // 跳转到首页tab（需全局变量传参） // 当前页面设置数据 getApp().globalData.tabIndex = 2; wx.switchTab({ url: '/pages/home/home' }); // 目标tab页的onShow中获取数据 onShow() { const tabIndex = getApp().globalData.tabIndex; } ``` --- #### 四、常见问题 1. **为什么`wx.navigateTo`跳转tabBar页面会报错？** → 因tabBar页面需通过`wx.switchTab`或`wx.reLaunch`跳转[^1]。 2. **如何从tabBar页面返回普通页面？** → 需使用`wx.navigateTo`重新打开普通页面，因tabBar页面独占页面栈。 ---
评论 16
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值