小程序点击图片放大效果 单张图片 多张图片

<block wx:for="{{effect_pic}}" wx:key="*this"  >
      <swiper-item wx:key="*this">
        <image bindtap='previewImg' data-effect_pic='{{effect_pic}}'  data-src='{{item}}' src="{{item}}" mode="aspectFill" class="slide-image" class='img' />
      </swiper-item>
    </block>

  // 图片点击放大 
  previewImg: function (e) {
    var src = e.currentTarget.dataset.src;//获取data-src  循环单个图片链接
    var imgList = e.currentTarget.dataset.effect_pic;//获取data-effect_pic   图片列表
    //图片预览
    wx.previewImage({
      current: src, // 当前显示图片的http链接
      urls: imgList // 需要预览的图片http链接列表
    })
  },

 单张图片点击放大效果

?

1	urls必须是一个数组  且 第一个值不能为空

<view class='honourBox'>
      <view class='honourList' wx:for="{{honor_id}}" wx:key="*this" bindtap='viewbigimg' data-licence='{{licence}}' data-name='{{item.name}}'>
        <image  class='img-honour' src='{{item.honor_pic}}'></image>
        <view>{{item.name}}</view>
      </view>
    </view>

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// 点击平台荣誉下的列表图片放大   viewbigimg: function(e) {     var that = this;     console.log(e.currentTarget.dataset.name)     console.log(e.currentTarget.dataset.licence)     if (e.currentTarget.dataset.name == "持证") {       var imgArr = [];       imgArr[0] = e.currentTarget.dataset.licence       wx.previewImage({         current: e.currentTarget.dataset.licence, //当前图片地址         urls: imgArr       })     }   }