支付寶小程序中點擊圖片進行放大查看切可以左右滑動

在axml文件中寫入代碼

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

在js文件中寫入代碼

Page({
  data: {
    img_title: "風采",
    imgarr: ['../../images/xiaoyuanfengcai.png', '../../images/xiaoyuanfengcai.png', '../../images/xiaoyuanfengcai.png']
  },
  onLoad(query) {
  },
  imgYu(event){//圖片點擊事件
    var src = event.currentTarget.dataset.src;//獲取data-src
    var imgList = event.currentTarget.dataset.list;//獲取data-list
    //圖片預覽
    my.previewImage({
      current: src, // 當前顯示圖片的http鏈接
      urls: imgList // 需要預覽的圖片http鏈接列表
    })
  },
});
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章