微信小程序> 微信小程序:点击图片进行预览

微信小程序:点击图片进行预览

浏览量:2216 时间: 来源:loverxy丶Du

 https://www.jianshu.com/p/8677e5a1927a

wxml:<view class='index_showpic'>    <view class='li_pic' wx:for="{{imgArr}}"  wx:key='index'>      <image src='https://{{item}}' bindtap='previewImg' data-src='{{item}}' class='img'></image>        </view> </view>wxss:.index_showpic{  width: 100%;}.imgList .li_pic{  width: 100%;}.imgList .li_pic .img{  width: 400rpx;  height: 400rpx;}wx.js: data: {    imgArr:[      'http://bpic.588ku.com/element_origin_min_pic/16/10/30/528aa13209e86d5d9839890967a6b9c1.jpg',      'http://bpic.588ku.com/element_origin_min_pic/16/10/30/54fcef525fa8f6037d180f3c26f3be65.jpg',      'http://bpic.588ku.com/element_origin_min_pic/16/10/30/62e3ca3a02dddb002eff00482078d194.jpg',      'http://bpic.588ku.com/element_origin_min_pic/16/10/31/c7167fcfb4ebcd12621c05b0c852e98e.jpg'    ]  },  previewImg:function(e){    var imgUrl = e.currentTarget.dataset.src; //获取当前点击的图片    var imgArr = this.data.imgArr;    wx.previewImage({      current: imgUrl, //当前图片地址      urls: imgArr,  //所有要预览的图片的地址集合数组形式      urls: [imgUrl], //一张图写法      success: function(res) {},      fail: function(res) {},      complete: function(res) {},    })  }

 

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎