原生微信小程序跳转传参 : [非TabBar跳转传参] 和 [TabBar跳转传参]

钟情大士
• 阅读 1077

一般常用的微信小程序跳转分为两种

1、非TabBar跳转
2、TabBar跳转

1、非TabBar跳转

非TabBar页面的跳转通常使用wx.navigateTo来跳转页面,在链接后面加 ? 传参,如下:

// 跳转页面 ? 后面传参 goods_id = 参数
 wx.navigateTo({
        url: `../goodsDetail/goodsDetail?goods_id=${goodsid}`,
      })

// 跳转页面接参
   onLoad(options) {
      // 此处的options.goods_id 就是页面跳转传过来的参数
        this.setData({
          goods_id : options.goods_id
        })
    },

2、TabBar跳转

跳转TabBar页面,一般使用wx.switchTab跳转,跳转TabBar常规的带参方式是不行的,官方文档已有说明
原生微信小程序跳转传参 : [非TabBar跳转传参] 和 [TabBar跳转传参]
所以这里无法在链接上带参,此处可以使用全局变量 getApp() ,具体操作如下:

 // 跳转购物车
    jumpCart() {
      // 给全局变量添加一个参数 id
     getApp().id = 1
     wx.switchTab({
       url: '/pages/cart/cart'
     })
    },

// 购物车页面
let app = getApp()  // 获取全局变量
Page({
   onLoad(options) {
        console.log(app.id);   // 此处的app.id就是上个页面跳转带过来的参数
    },
)}

点赞
收藏
评论区
推荐文章
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
胡哥有话说 胡哥有话说
5年前
喜大普奔,微信终于支持外网打开小程序啦!
前言千呼万唤始出来,微信小程序终于支持以URLScheme的形式从外部唤起了。longlongago我们只能在微信内的网页中使用微信开发标签小程序跳转按钮
放学路上 放学路上
3年前
微信小程序事件传参与vue传参的不同
1、vue点击事件传参(day)的写法:2、微信小程序写法(1)事件传参(2)获取参数dayprocess(e)console.log(e.currentTarget.dataset.day)3、总结:微信小程序不支持事件传参,可以通过把参数绑定在元素上,通过currentTarget.dataset获取参数。
马丁路德 马丁路德
4年前
微信小程序 - 页面间传值
小程序页面间传值大家晚上好,说晚上好是因为是在晚上写的,说这句话是因为这句话开篇不那么突然。那么小程序的页面间传值,在我使用这段时间里,我就非常的主观的把它们分为wx.navigateTo和非wx.navigateTo的,因为wx.navigateTo有一个事件参数event,我从当前页跳转到下一页,如果需要能返回,我都用的wx.naviga
梦
5年前
微信小程序new Date()转换时间异常问题
微信小程序苹果手机页面上显示时间异常,安卓机正常问题image(https://imghelloworld.osscnbeijing.aliyuncs.com/imgs/b691e1230e2f15efbd81fe11ef734d4f.png)错误代码vardate'2021030617:00:00'vardateT
马丁路德 马丁路德
4年前
微信小程序 - 路由实践
欢迎来到我博客阅读:1\.前言在微信小程序由一个App()实例,和众多Page()组成。而在小程序中所有页面的路由全部由框架进行管理,框架以栈的形式维护了所有页面,然后提供了以下API来进行路由之间的跳转:1.wx.navigateTo2.wx.redirectTo3.wx.navigateBack4.
梦
5年前
服务号跳转微信小程序的坑
服务号跳转微信小程序一直报错{"errcode":40165,"errmsg":"invalidweapppagepathhint:8yDcBa01023942"}
Stella981 Stella981
4年前
App唤起微信小程序和回调
在同一开放平台账号下的移动应用及小程序无需关联即可完成跳转,非同一开放平台账号下的小程序需与移动应用(APP)成功关联后才支持跳转。可在“管理中心移动应用应用详情关联小程序信息”,为通过审核的移动应用发起关联小程序操作。唤起App打开下程序他有两种方式:1,通过App分享小程序卡片到微信,然后在微信上点击小程序卡片打开小程序,
Wesley13 Wesley13
4年前
JS中POST带参数跳转
有个项目中要跳转到另外一个项目,还需要带参数考虑到安全性的问题,最好是用POST跳转,不能再URL中拼参所以找到了这个方法直接在JS中模拟form表单POST提交1functiontoQrPay(){23varparamesnewArray();4
Easter79 Easter79
4年前
SpringMVC——redirect重定向跳转传值
springmvc在controller方法里面跳转外网的方法1.returnnewModelAndView(newRedirectView("https://www.baidu.com"));2.return "redirect:https://www.baidu.com/";
布局王 布局王
8个月前
鸿蒙仓颉开发语言实战教程:页面跳转和传参
前两天分别实现了商城应用的首页和商品详情页面,今天要分享新的内容,就是这两个页面之间的相互跳转和传递参数。首先我们需要两个页面。如果你的项目中还没有第二个页面,可以右键cangjie文件夹新建仓颉文件:新建的文件里面没什么内容,我们给他添加上4个基础的引用
钟情大士
钟情大士
Lv1
现实如山,而我浪漫如云。
文章
2
粉丝
0
获赞
0