需求:点击图片实现放大预览
实现:调用微信官方给出的方法 wx.previewImage
注:urls 必须是数组
<image src="{{imgUrl}}" data-src="{{imgUrl}}" bindtap="previewImage" />
data: {
imgUrl:'https://img.yzcdn.cn/vant/cat.jpeg'
}
previewImage(e){
var currentUrl = e.currentTarget.dataset.src //获取当前点击图片链接
wx.previewImage({
current:currentUrl,//当前点击的预览图片地址
urls: [currentUrl],//需要预览的图片列表,这是必须设置的属性
})
}
效果图: