支付宝小程序中点击图片进行放大查看切可以左右滑动

在axml文件中写入代码

<view class="campus-img">
	<block a:for="{{imgarr}}">
		<image src="{{item}}" mode="scaleToFill" onTap="imgYu" data-list="{{imgarr}}" data-index="{{index}}" />
	</block>
</view>

在js文件中写入代码

Page({
  data: {
    img_title: "风采",
    imgarr: ['../../images/xiaoyuanfengcai.png', '../../images/xiaoyuanfengcai.png', '../../images/xiaoyuanfengcai.png']
  },
  onLoad(query) {
  },
  imgYu(event){//图片点击事件
    var index = event.currentTarget.dataset.index;//获取data-index
    var imgList = event.currentTarget.dataset.list;//获取data-list
    //图片预览
    my.previewImage({
      current: index, // 当前显示图片的下标
      urls: imgList // 需要预览的图片http链接列表
    })
  },
});

猜你喜欢

转载自blog.csdn.net/qq_41981057/article/details/88529820
今日推荐