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

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

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

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常规的带参方式是不行的,官方文档已有说明

所以这里无法在链接上带参,此处可以使用全局变量 getApp() ,具体操作如下:

// 跳转购物车
    jumpCart() {
      // 给全局变量添加一个参数 id
     getApp().id = 1
     wx.switchTab({
       url: '/pages/cart/cart'
     })
    },
// 购物车页面
let app = getApp()  // 获取全局变量
Page({
   onLoad(options) {
        console.log(app.id);   // 此处的app.id就是上个页面跳转带过来的参数
    },
)}
目录
相关文章
|
JSON 小程序 JavaScript
原生微信小程序笔记完整总结
原生微信小程序笔记完整总结
578 1
|
小程序
微信小程序多种跳转页面方式
微信小程序多种跳转页面方式
|
小程序 开发者
Taro@3.x+Vue@3.x+TS开发微信小程序,使用自定义tabBar
本文介绍了如何在Taro项目中实现自定义tabBar。首先,在`app.config.ts`中设置`custom: true`并配置`tabBar`。
1224 1
Taro@3.x+Vue@3.x+TS开发微信小程序,使用自定义tabBar
|
小程序
微信小程序动态tabBar实现:基于自定义组件,灵活支持不同用户角色与超过5个tab自由组合(更新版)
微信小程序动态tabBar实现:基于自定义组件,灵活支持不同用户角色与超过5个tab自由组合(更新版)
2739 1
|
机器学习/深度学习 人工智能 JSON
微信小程序原生AI运动(动作)检测识别解决方案
近年来,疫情限制了人们的出行,却推动了“AI运动”概念的兴起。AI运动已在运动锻炼、体育教学、线上主题活动等多个场景中广泛应用,受到互联网用户的欢迎。通过AI技术,用户可以在家中进行有效锻炼,学校也能远程监督学生的体育活动,同时,云上健身活动形式多样,适合单位组织。该方案成本低、易于集成和扩展,已成功应用于微信小程序。
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
3771 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
小程序 开发工具
app跳转微信小程序,使用明文scheme拉起
app跳转微信小程序,使用明文scheme拉起
3730 4
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
3769 7
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
4068 1
|
小程序 前端开发 测试技术
微信小程序的开发完整流程是什么?
微信小程序的开发完整流程是什么?
2410 7

热门文章

最新文章