小程序携带参数跳转到页面详情页(附源码)
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
})
},
以上是本人的学习经验,希望可以帮助更多的人。