微信小程序wx.navigateTo跳转参数大小超出限制问题

微信小程序的跳转方式

wx.navigateTo(Object)：保留当前页面，跳转到应用内的某个页面，使用 wx.navigateBack 可以返回到原页（新页面入栈）
wx.redirectTo(Object)：关闭当前页面，跳转到应用内的某个页面（当前页面出栈，新页面入栈）
wx.switchTab(Object)：跳转到 tabBar 页面，同时关闭其他非 tabBar 页面（非Tab页面全部出栈，只留下新的 Tab 页面）
wx.navigateBack(Object)：返回上一页面（页面不断出栈）
wx.reLaunch(Object)：关闭所有页面，打开到应用内的某个页面（页面全部出栈，只留下新的页面）

跳转携带参数的方法：在跳转的链接后接?参数名=参数

wx.redirectTo({url: `../heartOrder/index?Info=${JSON.stringify(obj)}`
})

跳转携带的参数必须转换为字符串，否则报错。

小程序跳转带参的字符长度是受限制的，如果字符过长，会被截取掉，解决办法如下：
使用encodeURIComponent和decodeURIComponent对字符进行编码和解码
encodeURIComponent(url)：
可把字符串作为 URI 组件进行编码，返回URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。

该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ’ ( ) 。其他字符（比如：;/?: @&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。

decodeURIComponent(url) ：
可把字符串作为 URI 组件进行解码。返回URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。

跳转页

wx.redirectTo({url: `../heartOrder/index?Info=${encodeURIComponent(JSON.stringify(obj))}`
})

接收页

 onLoad(options) {let { Info} = optionsInfo = JSON.parse(decodeURIComponent(Info))
}

onShow上获取参数

// 1 获取当前的小程序的页面栈-数组 长度最大是10页面
let pages = getCurrentPages();
// 2 数组中 索引最大的页面就是当前页面
let currentPage = pages[pages.length - 1];
// 3 获取url上的type参数
const { type } = currentPage.options;

微信小程序wx.navigateTo跳转参数大小超出限制问题相关推荐

小程序wx.navigateTo 跳转页面简单封装和运用
刚接触小程序,页面跳转一般是最先遇到的一种需求之一. 对于小程序中的跳转,官方文档给出了几种 api 来根据不同场景,实现业务需求. 这是针对 wx.navigateTo 来写的一片文章. 微信小程序 ...
微信小程序wx.navigateTo路由循环嵌套问题解决
在开发微信小程序时因为可能会出现页面路由循环,返回键不能直接返回真正的上一页的情况场景描述: 在导航列表页有搜索功能,点击搜索跳转搜索页面,选择搜索信息后点击确定,将参数放在url中返回导航列表页. ...
uni-app微信小程序uni.navigateTo跳转无效问题；记录一次uni-app页面跳转无效，来回跳转问题；wx.navigateTo ，跳转超过10次怎么点不动的解决办法。
场景需求:从小程序A页面跳转到小程序B页面,然后B页面还可以跳到A页面. 跳转失效原因: –1.uni.navigateTo只能跳转到非tabBar页面,tabBar导航栏页面只能用uni.switc ...
微信小程序wx.navigateTo传值
传一堆字符串,可直接传值,当传对象时,遇到的问题 <view class="goods-box" wx:for-items="{{source}}" wx ...
微信小程序uni.navigateTo跳转携带的参数中有问号被直接截取问题处理
问题描述 let url = "https://www.baidu.com/info/infodetail?adid=18223&id=29245" uni.navigat ...
微信小程序开发-页面跳转传递参数
微信小程序开发-页面跳转传递参数页面跳转有四种方式,分别为wx.navigateTo.wx.redirectTo.wx.reLaunch.wx.switchTab,前面三种可通过url路径携带参数实 ...
微信小程序点击带id参数跳转_微信小程序页面跳转方法和携带参数详解
1.页面跳转方式 (1)标签跳转 open-type的属性值对应api里的用法即wx.的用法 1 跳转到新页面 (2)wx.navigateTo 方法跳转此方法能够从跳转的页面会回到当前页面 1 w ...
vue 传参微信_小猿圈web前端之微信小程序页面间跳转传参方式总结
原标题:小猿圈web前端之微信小程序页面间跳转传参方式总结最近小程序发展的越来越快,很多大公司也在打造自己的小程序平台以及购物小程序等等,今天小猿圈web前端讲师就总结了关于微信小程序的知识点,首先 ...
微信小程序和微信小程序之间的跳转和传参示例代码附讲解
微信小程序开发交流qq群 173683895 承接微信小程序开发.扫码加微信. 正文: 一:微信小程序跳转使用限制需要用户触发跳转从 2.3.0 版本开始,若用户未点击小程序页面任意位 ...
uniapp开发微信小程序 wx.navigateBack()携带数据问题
uniapp开发微信小程序 wx.navigateBack()携带数据问题某个表单页面有时需要跳转另一个页面查询数据但如此想要保存当前页面数据需要在另一个查询页面调用 wx.navigateBa ...

微信小程序wx.navigateTo跳转参数大小超出限制问题

onShow上获取参数

微信小程序wx.navigateTo跳转参数大小超出限制问题相关推荐

最新文章

热门文章