微信小程序传递数据给上一个页面 getCurrentPages用法

时间:2024-04-03 09:18:32

用getCurrentPages把当前页面的数据传给前一个页面,这种方式在微信小程序使用场景非常多。

testa.wxml

 <view class='container'>
                <text>{{name}}</text>    
                <text>{{dataFromB}}</text>
            </view>
            <button type = "primary" catchtap='goToPageB'>跳转到下一页</button>

testa.wxss

page{
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    width: 100%;
    background: #fff;
}

.currentPage{
    width: 100%;
    height: 80rpx;
    padding-left: 150rpx;
    background-color: #f0f;
    line-height: 80rpx;

}
.container{
    width: 600rpx;
    height: 300rpx;
    background-color: #f0f;
    margin-top: 80rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 80rpx;
}

testa.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    name: '我是A页面',
    dataFromB: ''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  goToPageB: function () {
    wx.navigateTo({
      url: '../testb/testb'
    })
  }


})

testb.wxml

<view class='container'>
    <text>{{name}}</text>
</view>


<button type = "primary" catchtap="gotoA">回到上一页</button>

testb.wxss

page {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    width: 100%;
    background: #fff;
}

.currentPage {
    width: 100%;
    height: 80rpx;
    padding-left: 150rpx;
    background-color: #0ff;
    line-height: 80rpx;
}

.container {
    width: 600rpx;
    height: 300rpx;
    background-color: #0ff;
    margin-top: 80rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 80rpx;
}

testb.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    name: '我是B页面'
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  gotoA:function (e){
    let pages = getCurrentPages();
    let currPage = null; //当前页面
    let prevPage = null; //上一个页面

    if(pages.length >= 2){
      currPage = pages[pages.length - 1]; //当前页面
      prevPage = pages[pages.length - 2]; //上一个页面
    }
    if (prevPage) {
      prevPage.setData({
        dataFromB: '这里是B页面传过来的数据'
      });
    }

      wx.navigateBack({
      })
    
  }

})

微信小程序传递数据给上一个页面 getCurrentPages用法