uniapp 点击图片实现全屏预览并可以下载以及转发

uniapp 点击图片实现全屏预览并可以下载以及转发

//结构
<view class="imgs">
<image src="../../static/images/01.jpg" mode="widthFix" @click="clickImg(0)"></image>	
<image src="../../static/images/02.jpg" mode="widthFix" @click="clickImg(1)" ></image>
</view>

//函数方法
fullScreen(i) {
				wx.previewImage({
					urls: [
						"../../static/images/01.jpg",
						"../../static/images/02.jpg"
					], //需要预览的图片http链接列表,多张的时候,url直接写在后面就行了
					current: i, // 当前显示图片的http链接,默认是第一个
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {},
				})
			},
  • 如上是固定死的一个写法,如果有特别多的图片 每张都要这种预览效果 应该使用遍历
  • 当点击哪张图片是就将哪张图片的地址传入 函数中进行处理
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值