本文介绍在uniapp中如何利用 uni.navigateBack() 返回上级页面并传递数据。核心步骤包括通过 getCurrentPages() 获取页面栈,定位上一页面实例,调用其绑定的方法并传入参数,最后执行返回操作。
uniapp navigateBack 返回上一页传参教程
在uniapp中利用 uni.navigateBack() 实现返回上级页面并传递参数
场景:从A页面跳转至B页面,B页面处理完毕后需将数据回传至A页面
实现方案:
- 在B页面的相关事件处理逻辑中执行以下步骤:
1. 调用 getCurrentPages() 获取页面栈,参考官方文档说明
该方法返回按入栈顺序排列的页面实例数组,首项为首页,末项为当前页
2. 提取上一个页面的实例对象
3. 在上一个页面实例上调用并传递参数给指定方法
4. 执行返回上一级页面的操作
代码示例:
// 返回A页
goPageA(idx){
// 1. 获取当前页面栈实例(此时最后一个元素为当前页)
let pages = getCurrentPages()
// 2. 上一页面实例
// 注意是length长度,所以要想得到上一页面的实例需要 -2
// 若要返回上上页面的实例就 -3,以此类推
let prevPage = pages[pages.length -2]
// 3. 给上一页面实例绑定getValue()方法和参数(注意是$vm)
prevPage.$vm.getValue(this.list)
// 4. 返回上一页面
uni.navigateBack({
delta: 1 // 返回的页面数
})
}在A页面中定义并调用上述绑定的 getValue() 方法以接收B页面回传的数据
getValue(list){
console.log(list,'B页面传递的数据')
}关于uniapp中 uni.navigateBack() 返回并传参的教程至此结束,更多相关内容请参阅本站历史文章或继续浏览后续章节,感谢支持!