微信小程序页面之间传递数据和通信

Tue, 28 May 2024 15:49:21 +0800

微信小程序页面间通信有标准的方法。有页面A，页面B，按照顺序，A -> B，再从B -> A。两种操作页面之间数据传递。

A页面：

Page({
  jump: function () {
    wx.navigateTo({
      url: './b-page?id=123',
      events: {
        acceptDataFromOpenedPage: function (data) {
          //接收B页面发送的数据
          console.log(data)
        },
      },
      success: function (res) {
        //页面打开后发送数据到B页面
        res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'send from opener page' })
      }
    })
  },
})

B页面：

Page({
  onLoad: function (option) {
    const id = option.id;// 通过URL参数获取A页面传递的数据
    const eventChannel = this.getOpenerEventChannel()
    eventChannel.on('acceptDataFromOpenerPage', function (data) {
      //通过事件channel接收A页面传递的数据
      console.log(data)
    })
  },
  setDataToA: function () {
    const eventChannel = this.getOpenerEventChannel()
    eventChannel.emit('acceptDataFromOpenedPage', { data: 'send from opened page' })
  },
})

小程序 on 月盾的博客

微信小程序页面之间传递数据和通信