微信小程序实现预览图片

在这里插入图片描述
在这里插入图片描述
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//图片数组
            })
        },

猜你喜欢

转载自blog.csdn.net/qq_47272950/article/details/125721370