1.用bindtap 设定一个点击事件
例: <view class='right-box' wx:for="{{listdata}}" wx:key='index' data-name="{{item.name}}" bindtap='Shopdetail'>
<image src='{{ item.icon }}'></image>
<text class='text'>{{ item.name }}</text>
</view>
2. 在属于以上这段代码的js文件中写这个事件
// 点击单个商品跳到商品详情页
Shopdetail(e){
let id=e.currentTarget.dataset.id;
console.log(id)
wx.navigateTo({
url: '../shopdetail/shopdetail?id=' +id
})
},
3 .在你跳到的那个文件的js文件onLoad中写入你要获取的接口数据
data: {
shopdata:'',
hidden:true,
},
onLoad: function (options) {
console.log(options)
var shoplist=[ ];
wx.request({
url: 'https://api.it120.cc/small4/shop/goods/list',
success: (res)=> {
console.log(res.data.data)
for (var i=0; i<res.data.data.length ; i++) {
console.log(res.data.data[i].categoryId)
if (options.id==res.data.data[i].categoryId ){
shoplist.push(res.data.data[i])
console.log(shoplist)
this.setData({
shopdata: shoplist,
hidden: false, // 控制显示隐藏
//res代表success函数的事件对,data是固定的,stories是是上面json数据中stories
})
}
}
}
})
},
4. 在数据渲染到这个文件中
<view class='Shop'>
<view class='unShop' hidden='{{hidden==false}}'>
<image src='../../static/img/商品.png' class='Image'/>
<text class='Imagetext'>还没有商品哦</text>
</view>
<view class='shopdetail' hidden='{{hidden!=hidden}}'>
<view wx:for='{{shopdata}}' wx:key='index' class='singShop' data-id='{{item.id}}' bindtap='SingShop'>
<image src='{{item.pic}}' class='shopimage'/>
<text class='textname'>{{item.name}}</text>
<text class='textprice'>
<text class='textred'>¥{{item.originalPrice}}</text>
<text class='textstores'>已售{{item.stores}}</text>
</text>
</view>
</view>
</view>
网友评论