微信小程序返回上一页并携带参数，带参数返回上一页的三种方法总结(图文)

微wx笑 2019-10-12【常见问题】1366 14 0关键字：微信小程序

表单页面通常会需要这样的功能，跳转到下一个页面去选择或设置一个选择的值，这就需要在返回的时候把设置的值带回来。

微信小程序返回上一页并携带参数，带参数返回上一页的三种方法总结s7H无知

表单页面通常会需要这样的功能，跳转到下一个页面去选择或设置一个选择的值，这就需要在返回的时候把设置的值带回来。s7H无知

s7H无知

一、全局变量

app.js 中声明的 globalData，整个程序可见s7H无知

//app.js
App({
   
  globalData: {
    userInfo: null,
    openId: "",
    appId: "wx2b13bdbb7"
  },
 
  /**
   * 根据页面URL、页面栈返回之前打开的页面
   */
  navigation: function (pageUrl) {
    var cps = getCurrentPages();
    console.log(cps);
    var delta = 0;
    for (var i = cps.length - 1; i >= 0; i--) {
      if ("/" + cps[i].route == pageUrl) {
        if (delta == 0) {
          return;
        }
        wx.navigateBack({ delta: delta });
        return;
      }
      delta++;
    }
    wx.navigateTo({
      url: pageUrl
    });
  }
})

二、本地存储

获取数据s7H无知

1 2	`var` `openid = wx.getStorageSync("openid");` `var` `phone = wx.getStorageSync("phone");`

保存数据s7H无知

1 2	`wx.setStorageSync("openid", res.data.openid);` `wx.setStorageSync("phone", res.data.phone);`

三、页面栈

这是比较方便比较推荐的一种方式s7H无知

实际应用代码
s7H无知

  submit: function (e) {
    // 返回上一页携带参数
    let pages = getCurrentPages(); //获取页面栈
    let prevPage = pages[pages.length - 2]; //获取上一页引用
    let prevData = prevPage.data.assetList; //获取上一页中的数据
     
    // 。。。具体数据如何处理看你自己了。
     
    // 设置上一页中的数据，也就是把本页的数据传递给上一页
    prevPage.setData({
      assetList: prevData,
    })
    // 返回上一页
    setTimeout(() => {
      wx.navigateBack({
        delta: 1 //想要返回的层级
      })
    }, 500)
  },

prevPage.data.assetList 就是上一页 js 文件中定义的数据：s7H无知

Page({
 
  /**
   * 页面的初始数据
   */
  data: {
    assetList: [
      { id: 1, assetName: '图书', num: 16, unit: '本', worth: 1.00, sltNum:0 },
      { id: 2, assetName: '电脑', num: 10, unit: '台', worth: 1.00, sltNum: 0 },
      { id: 3, assetName: '手机', num: 15, unit: '个', worth: 1.00, sltNum: 0 },
      { id: 4, assetName: '笔', num: 19, unit: '个', worth: 1.00, sltNum: 0 },
      { id: 5, assetName: '本', num: 6, unit: '本', worth: 1.00, sltNum: 0 },
      ],
  },
}