微信小程序点击数据列表，进入列表详情页面的思路

1.在index.wxml
通过 bindtap去绑定一个事件。对于详情页的传输数据，点击事件可以通过 data- 去实现，后面相当于是键值对，data-id="{{item.id}}"，意思是把列表的id传过去。

<view class="goods"><view wx:for="{{listTwo}}" wx:key="{{index}}" class="goods-list"bindtap="toDetail" data-id="{{item.id}}"><image src="{{item.pic}}"></image><view class="van-ellipsis">{{item.name}}</view></view>
</view>

2.在index.js，可以定义 toDetail 方法，传入 event事件对象，如图：

在这里插入图片描述
3.通过控制台打印可以发现，event.currentTarget.dataset.id的值就是从列表页传过来的 id 的值。然后，就可以通过 wx.navigateTo 进行详情页的跳转，通过拼接的 id的值。

 //跳列表详情页面toDetail(event){// console.log(event.currentTarget.dataset.id)const id = event.currentTarget.dataset.id;//根据idwx.navigateTo({url: '/pages/index/detail/detail?id=' + id,})}

4.在detail.js 中，在onLound生命周期函数中

 // 在页面一开始加载的时候就会执行onLoad:function(options){let id = options.id   //从列表页传过来的id值//  console.log(id)http.getDetail({id:id}).then(res=>{if(res.data.code==0){ //这里的code为0代表数据获取成功this.setData({detailSwiper: res.data.data.pics,basicInfo:res.data.data.basicInfo,content:res.data.data.content.replace(/\<img/gi, '<img style="display:block;max-width:100%;height:auto;margin:0 auto;padding:0"')})}else if(res.data.code !=0){wx.showToast({title: '数据加载失败',duration: 2000})}})}