原生微信小程序跳转传参 : [非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就是上个页面跳转带过来的参数
},
)}
原生微信小程序跳转传参 : [非TabBar跳转传参] 和 [TabBar跳转传参]的更多相关文章
- Taro -- 原生微信小程序转taro
微信小程序转Taro (转发https://nervjs.github.io/taro/docs/taroize.html) Taro 可以将你的原生微信小程序应用转换为 Taro 代码,进而你可以 ...
- 微信小程序答题,怎么设计页面渲染,答完一题,跳到下一题
想要的效果 1.第一页只显示第一道题的内容,如图红框2.答题后,点击下一题,内容显示第二道题的内容 代码 answer.wxml <!--pages/answer/answer.wxml--&g ...
- 如何在原生微信小程序中实现数据双向绑定
官网:https://qiu8310.github.io/minapp/ 作者:Mora 在原生小程序开发中,数据流是单向的,无法双向绑定,但是要实现双向绑定的功能还是蛮简单的! 下文要讲的是小程序框 ...
- 微信小程序从入坑到放弃之坑十二:navigator无法跳转的坑
转自:http://www.yilingsj.com/xwzj/2018-11-25/weixin-miniprogram-navigator.html 微信小程序中的页面跳转用navigator就行 ...
- 原生微信小程序数据渲染
一直在写vue,第一次接触微信小程序,还是原生,最开始做的时候真的很闹心啊啊啊啊啊啊啊啊啊啊啊啊!!所以最近大概更新的都是微信小程序原生的内容了~~么么哒!!一定会继续努力的!!tips:在小程序项目 ...
- 原生微信小程序脚手架(支持npm)
微信小程序支持npm 为了支持生态扩展,社区贡献者可以提供更加丰富的功能,已经支持了第三方小程序开发功能,见如下地址. 微信小程序支持npm https://developers.weixin.qq. ...
- 微信小程序 - 自适应swiper高度(非组件)
微信小程序swiper默认高度375rpx,一旦超过这高度,就滑动不到内容了,我们利用css3可以很简单做到这件事情 原理: 利用css3 横轴滚动属性overflow:scroll,设置死swipe ...
- 如何将原生微信小程序页面改成原生VUE框架的H5页面
项目背景: 公司为了实现小程序与H5页面共同覆盖,全面推广.特此想将已有的小程序进行快速改造上线(二周内),研发出H5版本.目前公司前端技术较为薄弱,现有的技术解决方案还停留在JSP. 问题: 如何将 ...
- 原生微信小程序的生命周期
小程序的生命周期函数:onLaunch:function(){当启动小程序时触发小程序只会启动1次,一般为初次打开时一般只会触发一次},onShow:function(){当小程序从后台切入到前台时触 ...
- 原生微信小程序里类似于计算属性写法
可直接在wxml文件里直接写入直接调用.变量只支持var命名,不支持let const </view> <view class="wx_bgc" ...
随机推荐
- (C++) C++虚函数性能分析
class baseA { public: virtual float mulTwo(float a, float b) = 0; virtual ~baseA() = default; }; cla ...
- Velocity模板引擎的的使用示例(入门级)
简单说下这个引擎的两个分支(虽然语言不同调用方法大同小异): 1.Java平台下的:org.apache.velocity 2..Net平台下的:NVelocity 注:本文章不涉及到后端只说模板的使 ...
- 解决Emma中文乱码
vim -/.emma/emmarc 找到 db_encoding=latin1 改为 db_encoding=utf8 然后重新运行emma,此时发现还是乱码,不要着急,在执行所有的sql语句之前加 ...
- 在Windows模拟器中使用LVGL8.3
引言 LVGL是一个跨平台.轻量级.易于移植的图形库.也因其支持大量特性和其易于裁剪,配置开关众多,且版本升级较快,不同版本之间存在一定的差异性,相关的使用教程有一定的滞后性,由于缺少最新版本的中文教 ...
- C++编程笔记(QT)
目录 入门基础 模态对话框 消息提示框(messagebox) 文件和目录 字体选择框 输入对话框 进度条 工具栏 控件布局 Windows托盘案例 控件 button 下拉菜单按钮 `radioBu ...
- 【kafka】connect的timestamp模式无法同一秒插入多条记录问题解决
一.现在问题 同时插入多条时间戳相同的记录 INSERT INTO "ABANK" VALUES ('1', 'CH', '00211', 'UBS Switzerland AG' ...
- Kafka技术专题之「性能调优篇」消息队列服务端出现内存溢出OOM以及相关性能调优实战分析
内存问题 本篇文章介绍Kafka处理大文件出现内存溢出 java.lang.OutOfMemoryError: Direct buffer memory,主要内容包括基础应用.实用技巧.原理机制等方面 ...
- TortoiseGit (小乌龟安装配置及使用)
TortoiseGit 使用教程 (图文详解) 第一步 下载Git:下载地址:https://gitforwindows.org 第二步 下载TortoiseGit 以及 汉化包 (安装教程这里就不详 ...
- 认识一下 Mobx
我们是袋鼠云数栈 UED 团队,致力于打造优秀的一站式数据中台产品.我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值. 本文作者:霜序(掘金) 前言 在之前的文章中,我们讲述了 React ...
- MongoDB从入门到实战之MongoDB快速入门
前言 上一章节主要概述了MongoDB的优劣势.应用场景和发展史.这一章节将快速的概述一下MongoDB的基本概念,带领大家快速入门MongoDB这个文档型的NoSQL数据库. MongoDB从入门到 ...