小程序 - 设置上一层页面数据 & 监听页面滑动返回上一页

设置上一层页面数据

在某些场景下，我们需要在A页面进行表单的简单编辑，然后跳转(wx.navigateTo)进入B页面，进行详细的表单编辑；在B页面完成编辑后，返回A页面，将所有数据进行提交。

这里需要关注的是，B页面返回A页面中，需要携带当前页面的数据，便于在A页面中使用。

携带参数进入另一个页面，通常我们会使用以下的操作方式

wx.navigateTo({
  url: '../pageB/pageB?id=1' ,
})

但是这种表单填写的场景里，B页面返回A页面使用wx.navigateTo()方法，A页面原本填写的信息不会保存，只有使用wx.navigateBack()返回A页，A页面原本填写的信息才不会消失。

我最开始没有发现getCurrentPages()方法时，使用的是wx.setStorage()将B页面的数据缓存在本地，再从A页面中取出来，显然，这不是一种科学的解决办法。

后来在网上了解了getCurrentPages()方法，但是没有搜索到官方的文档介绍（如果你在官方文档看到过，请在回复中回复我链接，谢谢啦）

为了方便在多个页面中使用，我进行了简单的封装，app.js中主要代码如下：

// 获取上一层的页面
getPrevPage () {
  let pages = getCurrentPages();
  let prevPage = pages[pages.length - 2]; // pages[pages.length - 1] 当前页面
  return prevPage;                        // pages[pages.length - 2] 上一层页面
},

在B页面中的.js文件中，调用getPrevPage()方法：

let prevPage = getApp().getPrevPage(); // 获取上一层页面A

// 在A页面中赋值
prevPage.setData({
  id: 1
});

这样就完成了为上一层页面的赋值，在某些情况下，还可以为上上层页面赋值。

getCurrentPages()方法还可以获取当前页面URL中携带的参数，我进行了简单的封装，app.js主要代码如下：

// 获取 url 中携带的参数
getParamsFromUrl () {
  let pages = getCurrentPages();
  let params = pages[pages.length - 1]['options']; // 通过options对象，获取url中携带的参数
  return params;
},

例如，A页面通过wx.navigateTo跳转至B页面，其中 url: '../pageB/pageB?id=1'，在B页面中获取参数id的值，代码如下

let id = getApp().getParamsFromUrl()['id'];

拓展：url中不仅仅能携带id这样简单参数，还可以传递复杂的json对象，只需要将json对象通过JSON.stringify()序列化成字符串，在放到url中；同理，在获取这个json对象字符串后，需要使用JSON.parse()进行反序列化。

监听页面滑动返回上一页

微信小程序，在屏幕左边缘进行右滑，程序会返回上一页。某些场景下，我们需要监听这一行为，完成某些操作。可以使用微信官方提供的方法onUnload()。

在每个新建的Page文件夹中的.js都有onUnload()方法

当页面返回，控制台打印如下：