小程序源码之古诗词-微信小程序数据传递给子页面

​​​​

扫码体验

首页样式

语法

讲列表页数据直接带到详情页面

<view class='box'  data-item='{{item}}' bindtap='goDetail'>
      <text class="poet">
        <text wx:for='{{item.paragraphs}}' wx:key='index' wx:for-item="pItem">{{pItem}}</text>
      </text>
</view>

bindtap 绑定点击事件

goDetail (e) {
    wx.navigateTo({
      url: `/pages/detail/detail?id=${e.currentTarget.dataset.id}`,
      success: function(res) {
        res.eventChannel.emit('dataFromList', {data: e.currentTarget.dataset})
      }
    })
}

通过
eventChannel.emit('dataFromList', {data: e.currentTarget.dataset})

讲数据发送给子页面

子页面通过eventChannel.on('dataFromList'接收数据

    const eventChannel = this.getOpenerEventChannel()
    eventChannel.on('dataFromList', function(data) {
      that.setData({
        detail: data.data.item
      })
      that.loadDetail()
    })