微信小程序 wx.switchTab传参

想使用wx.switchTab跳转到另一个Tab后,再跳转到目标tab的一个二级界面。直接传参发现并不可行。

  • 传参方
    let folderID = this.data.folderID
    //跳转到目标Tab,并传参folderID
    wx.switchTab({
      url: '../../Folder/FolderList?folderID=' + folderID,
    })
  • 接收方
/**
 * 生命周期函数--监听页面加载
 */
onLoad: function (options) {
    console.log(options)  //控制台打印结果为{},并没有获取到参数folderID
}

查看小程序官方文档【传送门:wx.switchTab(Object object)】可知,URL路径后不能带参数。

wx.switchTab官方文档参数说明

那就只有转换思路:跳转、传参分开实现。我的思路是使用全局变量传参。

  • 跳转方

    //...省略无关代码
    let folderID = this.data.folderID
    //把参数保存至全局变量
    getApp().globalData.folderID = folderID
    //跳转到目标Tab
    wx.switchTab({
      url: '../../Folder/FolderList',
    })
  • 目标tab的onShow函数

/**
 * 生命周期函数--监听页面显示
 */
onShow: function () {
    let folderID = getApp().globalData.folderID
    console.log("get folderID:" + folderID)
    if (folderID > 0) {
      //全局变量清空/归零/重置
      getApp().globalData.folderID = -1
      //使用传过来的参数folderID
      wx.navigateTo({
        url: '../FolderDetail?folderID=' + folderID,
      })
    }
}

需要注意,接收数据的逻辑最好写在onShow里,因为如果要跳转的页面已经在路由栈里面了,onLoad可能会不执行。

并且wx.navigateTo不会关闭原界面,即界面没销毁。如果由于业务需要再次wx.navigateTo的话,也可能导致该页面onLoad不执行。所以写在onShow最稳妥。

你可能感兴趣的:(微信小程序 wx.switchTab传参)