需求:点击商品详情图,可以查看大图,并且可以进行缩放,还能左右滑动查看上下页
1.使用自带的my.previewImage功能
官网:https://opendocs.alipay.com/mini/api/media/image/my.previewimage
<button type="primary" onTap="bigImg"> Button </button>
bigImg(){
my.previewImage({
current: 0, // 初始化展示第几张图片
urls: [
'https://img.alicdn.com/tps/TB1sXGYIFXXXXc5XpXXXXXXXXXX.jpg',
'https://img.alicdn.com/tps/TB1pfG4IFXXXXc6XXXXXXXXXXXX.jpg',
'https://img.alicdn.com/tps/TB1h9xxIFXXXXbKXXXXXXXXXXXX.jpg'
],
});
}
2.使用enlarge-image插件 – 坑
官网:https://opendocs.alipay.com/mini/quickexample/image-enlargement
坑:1.不支持缩放 2.不能左右切换查看其它图片
例子查看官网