小程序携带参数跳转到页面详情页(附源码)

1.vxml在你需要跳转的按钮或者图片中绑定bindtap的内容,data-是需要跳转的参数的,其中的id为你想要跳转的参数。{}中的为跳转后携带的值。

<view class="body_left">
    <image src="/image/pause.png" bindtap="goPaly" data-id="{
   {item.id}}"></image>
  </view>

2.js页面中通过固定语句语法e.currentTarget.dataset为语法,其中在后面加入你的跳转参数。然后通过微信的wx.navigateTo进行跳转。其中在URL的路径中问好前面的为你需要跳转的路径,后面的为跳转的参数以及携带的值

goPaly(e){
   
  var id=e.currentTarget.dataset.id
  var ids=[]
  for(var i=0;i<this.data.songs.length;i++){
   
     ids.push(this.data.songs[i].id);
  }
  console.log(,ids)
  wx.navigateTo({
   
    url: '/pages/palyMusic/palyMusic?id='+id+'&ids='+ids,
  })
},

3.跳转页面的接受数据js,通过页面的监听函数onLoad函数进行页面的接受。options来接受数据

onLoad: function (options) {
   
    // 接受id
    var id=options.i
    this.setData({
   
      id:id
    })
  },

以上是本人的学习经验,希望可以帮助更多的人。