微信小程序swiper图片高度设置

index.js代码：

  data: {
    bannerimgUrls: [
      'https://**/images/banner1.jpg',
      'https://**/images/banner2.png'
    ],
    indicatorDots: true,
    autoplay: true,
    interval: 5000,
    duration: 1000,
    circular: true,
    Hei:""
  },
  imageLoad:function(e){
    var imgwidth = e.detail.width,
    imgheight = e.detail.height,
    ratio =  imgheight / imgwidth;
    var winWid = wx.getSystemInfoSync().windowWidth;
    var swiperH = winWid * ratio + "px";
    this.setData({
        Hei:swiperH
    })
  },

index.wxml代码：

<swiper class="banner" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" style="height: {{Hei}}">
    <block wx:for="{{bannerimgUrls}}" wx:key="*this">
    	  <swiper-item>
    		<image src="{{item}}" mode="widthFix" bindtap="calling" class="slide-image" bindload="imageLoad"/>
    	  </swiper-item>
      </block>
  </swiper>