wxml:
html
`<image class="rich_img" src="{{item}}" bindload="imageLoad" style="height:{{switerimgHeight}}rpx" mode="widthFix" bindtap='previewImg' data-effect_pic='{{richImgLists}}' data-src='{{item}}' id="{{index}}"></image>
写入方法bindload="imageLoad",该方法为每一个图片自动添加当前图片的实际高度:
js
imageLoad: function (e) {//获取图片真实宽度
console.log(e);
var imgwidth = e.detail.width,
imgheight = e.detail.height,
//宽高比
ratio = imgwidth / imgheight;
//计算的高度值
var viewHeight = 750 / ratio;
// var imgHeight = this.data.imgHeight;
//把每一张图片的对应的高度记录到数组里
// imgHeight[e.target.dataset.id] = viewHeight;
this.setData({
switerimgHeight: viewHeight
})
},
加image属性 mode="widthFix",使图片高度自适应;