小程序关于switchTab不能传参的问题

最新推荐文章于 2024-12-21 11:09:04 发布

前端江太公

最新推荐文章于 2024-12-21 11:09:04 发布

阅读量2.5k

点赞数 3

分类专栏： # 微信小程序 FE前端文章标签： wx.switchTab 传参

本文链接：https://blog.csdn.net/ZiChen_Jiang/article/details/107876488

版权

FE前端同时被 2 个专栏收录

256 篇文章

订阅专栏

微信小程序

37 篇文章

订阅专栏

本文介绍了解决微信小程序中使用wx.switchTab跳转到tabbar页面时无法传参的问题。通过设置全局变量并在目标页面读取，实现每次跳转时参数的更新与传递。

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

对于下面链接博客的补充

微信小程序：errMsg“:“navigateTo:fail can not navigateTo a tabbar page 报错问题

链接: https://blog.csdn.net/ZiChen_Jiang/article/details/107867061.

上篇博客说道想要跳转到tabbar，把`wx.navigateTo`更改为`wx.switchTab`即可。但是又有一个bug就是`wx.switchTab`不能传参

在这里插入图片描述

以下是解决办法：

wxml

	<van-grid column-num="5">
		<van-grid-item wx:for="{{ Nav }}" 
		 bindtap="nav" data-index="{{index}}" 
		 icon="{{item.icon}}" text="{{item.name}}" />
	</van-grid>

js

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

//点击轮播下方分类跳转到分类tabber
  nav(e) {
  
    getApp().index = e.currentTarget.dataset.index
    //设置全局变量 （  app已经定义var app=getApp（）   ）
    
    wx.switchTab({
      url: "/pages/classify/classify",
      
      success: function (e) {    //此方法相当于刷新页面
        var page = getCurrentPages().pop();
        if (page == undefined || page == null) return;
        page.onLoad();
      }
    })
  },

1、保存全局变量

getApp().index = e.currentTarget.dataset.index
//设置全局变量 （  app已经定义var app=getApp（）   ）

2、因为点击跳转并把参数保存到全局变量之后，只能保存一次参数。接受也只能接受一个。所以需要以下代码在每次点击的时候刷新一次重新把参数保存到全局变量

success: function (e) {    //此方法相当于刷新页面
        var page = getCurrentPages().pop();
        if (page == undefined || page == null) return;
        page.onLoad();
 }

接收参数

 /**
 * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let index=getApp().index
    consolo.log(index)
  },