小程序--解決Swiper 圖片高度自適應

 <swiper bindchange="bindchange" style="height:{{imgheights[current]}}rpx;" indicator-dots="{{indicatorDots}}"  autoplay="false" circular ='true' interval="5000" duration="1000">
                    <block wx:for="{{item.images}}" wx:for-item="itemName" wx:key='itemName'>
                      <swiper-item>
                        <image bindload="imageLoad"  data-id='{{index}}' src="{{itemName}}" class="slide-image"  mode="widthFix" style='width:100%'   />
                      </swiper-item>
                    </block>
</swiper>

Page({
   data:{
     imgheights: [],//所有圖片的高度  
     current:0
   } ,
  imageLoad(e){
      //當圖片載入完畢時
    var imgwidth = e.detail.width,
      imgheight = e.detail.height,
      //寬高比  
      ratio = imgwidth / imgheight;
      console.log(imgwidth, imgheight)
      // 計算的高度值
    var viewHeight = 750 / ratio;
    var imgheight = viewHeight;
    var imgheights = this.data.imgheights;
    //把每一張圖片的對應的高度記錄到數組里  
    imgheights[e.target.dataset.id] = imgheight;
    console.log('圖片的高度：'+imgheights)
    this.setData({
      imgheights: imgheights
    })
  },
  bindchange: function (e) {// current 改變時會觸發 change 事件
    this.setData({ current: e.detail.current })

 }, })