微信小程序实现预览图片

Posted 2022-11-29 老张在线敲代码

wxml代码

  <view class='contentbot'>
        <view class='contentWa' >
              <text style="border-bottom:1px solid #DC6D62;color: #DC6D62;width: 224rpx;" bindtap='previewImage'>查看凭证截图示例</text>
               <!-- <-- 如果要实现直接显示图片点击图片预览则把这个取消注释 --> -->
             <-- <image src='item.img_url' mode='widthFix' data-src='item.img_url' bindtap='previewImage'></image> -->
        </view>
  </view>

js代码

//预览图片
        previewImage: function (e) 
            var current = e.target.dataset.src;
            var imgList = [];
            for (let i = 0; i < this.data.wawa.length; i++) 
            imgList.push(this.data.wawa[i].img_url);
            
            wx.previewImage(
            current: current,//当前点击的图片链接
            urls: imgList//图片数组
            )
        ,