微信小程序图片左右滑动 图片放大

view:


        

js:

page({
    data:{
        imgArr:                         ['https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=832192736,1053576081&fm=27&gp=0.jpg',
'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=832192736,1053576081&fm=27&gp=0.jpg', 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=832192736,1053576081&fm=27&gp=0.jpg',
'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=832192736,1053576081&fm=27&gp=0.jpg'
    ]
           },
//点击图片放大
previewImg: function (e) {
    console.log(e.currentTarget.dataset.index);
    var index = e.currentTarget.dataset.index;
    var imgArr = this.data.imgArr;
    wx.previewImage({
      current: imgArr[index],     //当前图片地址
      urls: imgArr,               //所有要预览的图片的地址集合 数组形式
      success: function (res) { },
      fail: function (res) { },
      complete: function (res) { },
    })
  }
})

官方文档有详细介绍:https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html

注意文档下方bug提醒!!!

你可能感兴趣的:(微信小程序)