1、index.wxml页面:
<view class="imgList">
<swiper class='u-wrp-bnr' indicator-dots='true' duration='1000'
circular='true'style="height:750rpx">
<block wx:for="{{detailsImg}}" wx:for-index="index">
<swiper-item>
<image src='{{item}}' data-index='{{index}}' bindtap="previewImg" class="img"></image>
</swiper-item>
</block>
</swiper>
</view>2、index.wxss页面:
.imgList{
width:100%;
}
.imgList .img{
width:100%;
height:750rpx;
}3、index.js页面:
data:{
detailsImg:[]
}//点击图片预览
previewImg: function (e) {
console.log(e.currentTarget.dataset.index);
var index = e.currentTarget.dataset.index;
var detailsImg = this.data.detailsImg;
wx.previewImage({
current: detailsImg[index],//当前图片地址
urls: detailsImg //所有要预览的图片的地址集合数组形式
})
},//字符串切割
var shopImg = res.data.img
self.detailsImg = shopImg.split(",")