标签:serve glob 微信小程序 图片 本地 this ons 传递 分享
在微信小程序中预览图片分为
a、预览本地相册中的图片。
b、预览某个wxml中的多张图片。
分析:实质其实是一样的。都是给wx.previewImage传入参数
wx.previewImage{ current:‘‘.//打开预览时要显示图片的地址。 urls:[],//需要预览的图片的地址数组。 }
这里拿b、预览某个wxml中的图片列表来讲解bindtap的传值问题。a、预览本地相册。可以结合wx.chooseImage接口来实现,这里就不多说了。
// wxml中的关键代码 <view class="right imgs" > <view class="img" wx:for="{{item.info_file}}" wx:for-item="img" wx:key="img" id="img" bindtap=‘previewImg‘ id="img" data-imgs=‘{{item.info_file}}‘ data-currentimg="{{img}}"> <image src="{{server_host}}{{img}}"></image> </view> </view>
// 对应js中bindtap函数的代码 previewImg: function (event) { var that =this; console.log(event); var imgs= event.currentTarget.dataset.imgs; var temp=[]; for (var index in imgs){ temp = temp.concat(app.globalData.SERVER_HOST+imgs[index]); } wx.previewImage({ current: app.globalData.SERVER_HOST+event.currentTarget.dataset.currentimg, urls: temp, }) }
【微信小程序】--bindtap参数传递,配合wx.previewImage实现多张缩略图预览
标签:serve glob 微信小程序 图片 本地 this ons 传递 分享
原文地址:http://www.cnblogs.com/oldwei/p/7737940.html