微信小程序预览图片

1.先看微信小程序官方文档

2.给图片数组一个点击方法，下面我是给轮播图一个点击事件

<swiper class="swiper" indicator-dots='true' autoplay='true'>
	<swiper-item wx:for="{{bannerImage}}" bindtap="showBanner" data-url="{{item.bannerImage}}">
      <image style="width:100%;height:1000rpx;" src='{{item.bannerImage}}' mode="widthFix"></image>
    </swiper-item>
</swiper>

注意:bindtap是点击事件,date-url是传当前图片链接，等会会用到

3.js文件写点击事件

//banner图预览
  showBanner(e){
    const urls=this.data.bannerImage.map(v=>v.bannerImage)
    const current=e.currentTarget.dataset.url
    wx.previewImage({
      current,
      urls
    })
  },

注意：urls拿到的是你想要预览图片数组链接或者单个链接。文档要的是数组，当你想要预览单个的时候。也要用数组包裹它。current拿到的是当前点击那个图片链接。刚才由第二步date-url已经传过来了。直接在事件用e.currentTarget.dataset.url就可以拿到了。