返回

小程序页面间数据传递:navigateBack如何传递参数

前端

navigateBack方法,可以使我们返回到上一页。它还能我们在返回页面时传递数据,实现页面间数据交换。

如何使用navigateBack方法传递参数?

  1. 返回上一页
    使用navigateBack方法返回上一页的代码如下:

    wx.navigateBack({
      delta: 1,
      success: function() {
        // 在success回调函数中传递数据
      }
    })
    
  2. 传递参数
    在返回页面的success回调函数中,我们可以通过修改上一页的data对象,传递需要的数据。

    wx.navigateBack({
      delta: 1,
      success: function() {
        const pages = getCurrentPages(); // 获取页面栈
        const prevPage = pages[pages.length - 1]; // 获取上一个页面
        prevPage.setData({
          returnedData: 'Data from page B' // 传递参数
        });
      }
    })
    
  3. 获取传递的参数
    在返回的页面中,可以通过data对象获取传递的参数。

    // 页面A中任意地方获取来自页面B的参数
    Page({
      // 页面其他方法中获取来自页面B的参数
      someMethod() {
        console.log(this.data.returnedData); // 输出: Data from page B
      }
    })
    

navigateBack方法传递参数的优势

  • 简单易用: navigateBack方法使用方便,只需几行代码即可完成页面返回和数据传递。
  • 跨页面传递: navigateBack方法可以跨越多个页面传递数据,不受页面层级限制。
  • 安全性高: navigateBack方法传递的数据不会被其他页面窃取,保障数据安全。