微信小程序的跳转方式

  • 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)}`
})

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


小程序跳转带参的字符长度是受限制的,如果字符过长,会被截取掉,解决办法如下:

使用encodeURIComponentdecodeURIComponent对字符进行编码和解码

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} = options
Info = JSON.parse(decodeURIComponent(Info))
}

微信小程序wx.navigateTo跳转参数大小超出限制问题的更多相关文章

  1. 微信小程序wx.navigateTo层叠5次限制,特殊情况的建议

    小程序页面的实例使用栈的数据结构存储,栈内元素最多5个(换一种方式说,就是用户最多能点击5次返回),微信小程序能在栈中相对高层某个页面调用其他相对低层的页面实例的方法. 小程序三种页面跳转API 的区 ...

  2. 微信小程序 wx.navigateTo()传参及多个参数方法

    var workModeAndPriceList = res.data.data.workModeAndPriceList; //var result = JSON.stringify(workMod ...

  3. 微信小程序wx.navigateTo页面不跳转

    排查后发现: 若是在全局app.json中配置了tabBar,引用的链接与wx.navigateTo页面跳转url地址相同就无法实现跳转.

  4. 微信小程序wx.switchTab跳转到tab页面后onLoad里面的方法不执行

    相信大家在做小程序的时候启动页跳转到tab首页会用到switchTab 但是在跳转后发现页面模块不全,后面console.log()后发现是onLoad里面的方法不执行 解决这种问题的方法页有很多中, ...

  5. 微信小程序——wx.navigateTo点击后没反应

    首先,检查你跳转的目标路径是不是属于tabBar,若属于,且当前页面存在tabBar时,wx.navigateTo方法是失效的. 此时可用wx.switchTab方法,并记得在app.json中的&q ...

  6. 微信小程序富文本中的图片大小超出屏幕

    这个问题我在小程序社区中提的,后来有个帮我回答了这个问题,我试了一下可以. 解决办法是过滤富文本内容,给图片标签添加一个样式,限制图片的最大宽度. replace(/\<img/gi,   '& ...

  7. 微信小程序和微信小程序之间的跳转和传参示例代码附讲解

    一:微信小程序跳转 使用限制 需要用户触发跳转 从 2.3.0 版本开始,若用户未点击小程序页面任意位置,则开发者将无法调用此接口自动跳转至其他小程序. 需要用户确认跳转 从 2.3.0 版本开始,在 ...

  8. 微信小程序wx.request接口

    微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...

  9. 监控微信小程序wx.request请求失败

    在微信小程序里,与后台服务器交互的主要接口函数是wx.request(),用于发起 HTTPS 网络请求.其重要性不言而喻.然而,却经常遇到请求失败的问题,笔者特意谷歌"wx.request ...

  10. 微信小程序wx.showActionSheet调用客服信息功能

    微信小程序wx.showActionSheet调用客服消息功能 官方文档的代码: wx.showActionSheet({ itemList: ['A', 'B', 'C'], success (re ...

随机推荐

  1. AArch32/AArch64系统级内存模型(三)

    1. 内存系统架构 1.1 系统级存储系统体系结构的形式   Armv8的a -profile体系结构包括一个虚拟内存系统体系结构(Virtual Memory System Architecture ...

  2. CSP-S 游寄

    \(\text{reflection}\) 初赛. 本来以为上午要愉快地周测,但是伟大的虎哥让我们在四楼接着练习 然后就目睹了一个万能头+return 0编译 1min30sec 的奇迹 Win7 打 ...

  3. 【PostgreSQL/PGSQL】创建分区表与临时表

    一.分区表 1.链接 https://blog.csdn.net/zhangyupeng0528/article/details/119423234 2.分类 列(值)分区表:partition by ...

  4. Java面试多线程/JUC等知识

    2021年6月30日完成此部分内容整理

  5. 【开源库推荐】#4 Poi-办公文档处理库

    原文:[开源库推荐] #4 Poi-办公文档处理库 - Stars-One的杂货小窝 github仓库apache/poi Apache POI是Apache软件基金会的开放源码函式库,POI提供AP ...

  6. 关键字break和continue

    关键字:break 和continue提供了另一种控制循环的方式. break 是直接退出循环体 如: continue  是退出当前循环迭代 如: 需要注意的是:使用过多的break和continu ...

  7. TypeScript 之 Class

    class private 和 # 的区别 前缀 private 只是TS语法,在运行时不起作用,外部能够访问,但是类型检查器会报错 class Bag { private item: any } 修 ...

  8. 01.Typora基本使用

    1.标题 方法一: 在文字前面加上"#",将其变成标题. "#"的数量决定字体的大小."#"数量越多字体越小. 如下,其中一级标题是字体最大 ...

  9. 注意看,她叫小美,在地址栏输入URL地址后发生了什么?

    注意看,这个用户叫小美,他在地址栏输入了一串URL地址,然后竟然发生了不可思议的事情! 01.输入URL发生了什么? 从输入URL开始,到页面呈现出来,简单来说分为四个步骤: ① 建立连接:建立与服务 ...

  10. 多线程爬取wallhaven

    前言 最近整理自己的项目时,发现之前自己写的爬取wallhaven网站顿时有来的兴趣决定再写一遍来回顾自己以前学的知识 网站地址:"https://wallhaven.cc/" 1 ...