微信小程序图片点击预览

官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/wx.previewImage.html?search-key=wx.previewImage

1、单张图片点击预览:


    
  
//图片点击事件
  imgYu: function (event) {
    var that=this;
    var src = that.data.discount.imgPath;//获取data-src
    var imgList = [that.data.discount.imgPath];//获取data-list
    //图片预览
    wx.previewImage({
      current: src, // 当前显示图片的http链接
      urls: imgList // 需要预览的图片http链接列表
    })
  },

2、多张图片点击预览:


      
        
        
      
    
//轮播图点击预览
  imgYu: function (event) {
    var that = this;
    var src = event.currentTarget.dataset.src;//获取data-src
    var imgList = that.data.imgUrls;//获取data-list
    //图片预览
    wx.previewImage({
      current: src, // 当前显示图片的http链接
      urls: imgList // 需要预览的图片http链接列表
    })
  },

你可能感兴趣的:(微信小程序图片点击预览)