小百度小程序轮播图高度自适应

index.swan部分代码

<swiper indicator-dots="true" autoplay="true" style="height:{{Hei}}">
        <swiper-item s-for="{{syhd}}" s-for-item="img"><image mode="widthFix" src="{{img.url}}" bindload='imgH'></image></swiper-item>
</swiper>

1.设置“swiper” 标签高度为变量 Hei
2.bindload方法对image标签的图片显示成功时做处理，定义事件 imgH

index.js部分代码

Page({
    data: {
        Hei:'50px',	//定义默认高度，不宜过大
        syhd: []	//图片信息
    },
    imgH:function(e){
   		var winWid = swan.getSystemInfoSync().windowWidth;         //获取当前屏幕的宽度
   		var imgh=e.detail.height;　　//图片高度
    	var imgw=e.detail.width;
    	var swiperH=winWid*imgh/imgw;	//通过比例计算图片高度
    	if(swiperH==null || swiperH==''){
       		return;
    	}　　　　　　
    	this.setData({
       		Hei:swiperH + "px"　　　//设置高度
    	})
	},
    
})