小程序返回上一页面传递参数

最新推荐文章于 2023-07-31 10:30:29 发布

@Winner

最新推荐文章于 2023-07-31 10:30:29 发布

阅读量3.8k

点赞数 3

分类专栏：小程序

本文链接：https://blog.csdn.net/zxh7770/article/details/107744934

版权

小程序专栏收录该内容

26 篇文章

订阅专栏

阐述

有时候项目的需求是点击页面，然后携带参数并返回到上一个页面，比如说，用户选择收货地址，点击完收货地址，然后自动带着选择的收货地址返回上一个页面。如下图：
在这里插入图片描述

实现方式的代码如下：

一、使用“wx.navigateBack”进行返回上一级页面操作。

子页面（地址页面）代码如下：

selectAddress(e){
    console.log('选择了自提地址',e,oneselfAddress)
    let oneselfAddress = e.currentTarget.dataset.address;
    let pages = getCurrentPages();//获取page
    let prevPage = pages[pages.length-2];//上一个页面（父页面）
    //直接调用上一个页面的setData()方法，把数据存到上一个页面中去，oneselfAddress此参数必须在上一页面中的data声明定义。否则传递失败。
    prevPage.setData({
      oneselfAddress:oneselfAddress
    })
    
    //返回上一页面
    wx.navigateBack({
      delta: 1
    })
  }

父页面接收子页面传递过来的参数，并且保存。

在父页面的onLoad跟onShow里面接收子页面传递的参数，我这里使用onShow接收，因为onShow生命周期函数每次加载页面都会执行。

Page（{
	data:{
		oneselfAddress:''//接收子页面传递的参数
	}
	//接收上一个页面的参数
	    let pages = getCurrentPages();
	    let currPages = pages[pages.length-1]//当前页面
	    console.log('接收自提地址',currPages)
	    this.setData({
	      oneselfAddress:currPages.data.oneselfAddress
	    })
}）

二、使用“wx.navigateTo”跳转页面，进行携带参数

很简单就是跳转的时候把参数拼接在链接后面，然后在下一个页面的onload里通过option获取

传递参数代码如下：

let urlparams = 10
 wx.navigateTo({
      url: '/our/addresslist/index?parent=' + urlparams,
  })

接收参数代码如下：

Page({
	onLoad: function(options) {
		console.log('接收上一面传递的参数',options)
	}
})