小程序间跳转传递参数的核心在于正确选择传递方式和接收时机。下面三点帮你避开常见坑位。

参数传递的两种路径与选择

小程序间传递参数主要通过路径(path)拼接和额外数据(extraData) 两种方式。
• 路径参数:直接将参数拼接在目标小程序的页面路径后,形如 /pages/index?id=123。这种方式适合传递简单的、数据量小的参数,在目标页面的 onLoad 选项的 query 字段中获取。

• 额外数据:通过 extraData 属性传递对象类型的数据。它适合传递结构更复杂或稍大量的数据,在目标小程序 App.vue 的 onLaunch 或 onShow 生命周期函数 的 options.referrerInfo.extraData 中获取。

选择建议:关键标识符(如ID)用路径参数,复杂对象(如用户信息、配置项)用 extraData。需要注意,所有通过URL传递的参数(即路径参数)总长度通常受限于2KB左右,超限会导致数据截断。

参数接收的生命周期与时机

能否成功拿到参数,取决于在目标小程序的哪个生命周期函数内进行接收。
• App.vue 的 onLaunch / onShow:这是接收通过 extraData 传递的参数的正确位置。当小程序被另一个小程序打开时,会触发App级的生命周期。

• 具体页面的 onLoad:这是接收通过路径(URL)拼接的参数的位置。当目标页面被加载时,可以在此处获取到 query 对象。

常见误区:试图在页面的 onLoad 中获取 extraData 会导致失败,因为此时源小程序传递的 extraData 尚未注入到当前页面上下文中。

大数据量与特殊字符处理

当需要传递的数据量较大或包含特殊字符时,需要特殊处理以确保数据完整性和跳转成功率。
• 大数据量处理:如果参数数据量很大(如图表数据、长列表),强烈建议不要直接通过URL或 extraData 传递。可以考虑使用全局数据缓存(如Vuex/Pinia)或后端中转。更优的方案是使用小程序提供的 EventChannel(事件通道),它允许两个页面间直接进行事件通信,适合传输大型数据。

• 特殊字符处理:如果参数值包含 ?、&、= 等URL特殊字符,务必在拼接前使用 encodeURIComponent 进行编码,在接收端使用 decodeURIComponent 进行解码,防止参数被错误解析导致丢失。

——

常见追问:从A小程序跳转到B小程序的某个页面,B小程序如何知道是从哪里跳转来的?
简答:在B小程序的App.vue的 onLaunch 或 onShow 中,可以通过 options.referrerInfo.appId 获取源小程序(A小程序)的AppID。

操作提醒:正式环境跳转前,务必在真机上对参数传递和接收进行充分测试,模拟实际网络环境,避免开发工具调试正常而真机异常的情况。