• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序图片预览 wx.previewImage

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
 

 

 


list: [
           \'http://img5.imgtn.bdimg.com/it/u=3300305952,1328708913&fm=26&gp=0.jpg\',
           \'http://img.52z.com/upload/news/image/20180312/20180312060838_67790.jpg\',
        ],

// 如果用了wepy的话
<swiper-item v-for="item in list">
        <image :src="item" class="slide-image" data-list="{{list}}" data-src="{{item}}" style="width:100%; height:276rpx;" @tap="previewImage"/>
</swiper-item>

// 原始小程序 data-list : 所有预览图片; data-src: 当前预览图片
<swiper-item wx:for="{{list}}" wx:for-item="item">
                <image :src="item" class="slide-image" data-list="{{list}}" data-src="{{item}}" style="width:100%; height:276rpx;" @tap="previewImage"/>
</swiper-item>

methods: {
        previewImage: function (e) {
            var src = e.currentTarget.dataset.src; // 获取data-src
            var imgList = e.currentTarget.dataset.list; // 获取data-list
            wx.previewImage({
                current: src,   // 当前显示图片的http链接  
                urls: imgList,  // 需要预览的图片http链接列表  
                success: function(res) {
                    console.log(\'success\');
                },
                fail: function(res) {
                    console.log(\'fail\');
                },
            })
        }
},
wx.previewImage 不支持本地图片预览,只支持http或https链接图片

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
某商超小程序加密算法解析发布时间:2022-07-18
下一篇:
Wx-小程序-图片预览、保存发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap