小程序路由传参的方法?

小程序路由传参的方法有两种:

1.通过URL参数传递:可以在跳转页面时在URL中携带参数,目标页面可以通过获取URL参数来使用。使用wx.navigateTowx.redirectTo方法进行页面跳转,并在URL中添加参数。

示例代码如下:

html 复制代码
// 页面A跳转到页面B,并传递参数
wx.navigateTo({
  url: '/pages/bPage/bPage?id=123&name=小明'
});

在页面B中,可以通过getCurrentPages方法获取当前页面栈,并从栈顶获取参数:

html 复制代码
// 页面B获取参数
const pages = getCurrentPages();
const currentPage = pages[pages.length - 1];
const options = currentPage.options; // 获取URL参数

console.log(options.id);   // 输出:123
console.log(options.name); // 输出:小明

2.使用全局数据存储:可以将参数存储在全局数据中,在目标页面中直接获取和使用。通过getApp()方法获取小程序实例,在实例中定义一个全局数据变量,在源页面设置参数值,在目标页面获取参数值即可。

示例代码如下:

html 复制代码
// 在源页面设置参数值
const appInstance = getApp();
appInstance.globalData.id = 123;
appInstance.globalData.name = '小明';

// 页面A跳转到页面B
wx.navigateTo({
  url: '/pages/bPage/bPage'
});

在页面B中,可以通过getApp()方法获取小程序实例,并直接从全局数据中获取参数值:

html 复制代码
// 页面B获取参数
const appInstance = getApp();
console.log(appInstance.globalData.id);   // 输出:123
console.log(appInstance.globalData.name); // 输出:小明

以上是两种常见的小程序路由传参方法,可以根据具体需求选择使用。

相关推荐
梓彤科技17 小时前
样式已经更新,用户仍看到旧页面?武汉网站建设中的缓存版本控制
搜索引擎·小程序·seo·网站开发·geo
mashirro21 小时前
记一次基于ruoyi-vue新增小程序服务模块,小程序登陆相关
vue.js·小程序·mybatis
2601_956743681 天前
技术选型指南|D‑coding 小程序开发,定制能力如何转化项目服务价值
小程序·coding·开发经验
weishuangyun1231 天前
微信小程序怎么选公司?上线流程详解
大数据·小程序
show4331 天前
2026微信小程序视频转文字多语种识别引擎技术选型:22种方言25种外语挑战
微信小程序·小程序·音视频
lhldsg2 天前
县城外卖系统开发实战:从需求分析到上线全流程指南
java·小程序·需求分析
Kingexpand_com2 天前
旅游小程序怎么选型?模板与定制二次开发技术对比解析
小程序·旅游·小程序开发·旅行·定制开发
万岳科技系统开发2 天前
外卖跑腿小程序如何提升本地生活服务平台运营效率?
大数据·小程序·生活
MrFlySand_飞沙2 天前
uniapp开发微信小程序实现接入企业微信客服
微信小程序·小程序·uni-app·企业微信
Ai-_Man2 天前
豆包智能体把对话批量导出为Word或PDF的正确顺序
人工智能·ai·小程序·pdf·word