index.wxml
index.js
图片的高度
imgheights: [],//图片宽度
imgwidth: 750,//默认
current: 0
},imageLoad: function (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.push(imgheight);
this.setData({
imgheights: imgheights,})
},bindchange: function (e) {
console.log(e.detail.current)
this.setData({ current: e.detail.current })
}
})
swiper中默认高度150px,使用bindchange="bindchange"
style="height:{{imgheights[current]}}rpx;"
,使其高度变为当前选中图片的高度
其二,下面的单位为px而非rpx。
Page({
data: {
image: [
'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',activeColor: "#1472e0",auto:{},cur:0
},imageLoad: function (e) {
var imageWidth = e.detail.width,//获取图片真实宽度
imageHeight = e.detail.height,Imagescale = imageWidth / imageHeight; //宽高比
var autoWidth = '',//自适应高宽
autoHeight = '';
wx.getSystemInfo({
success: function(res) {
autoWidth = res.windowWidth; //设备屏幕宽度
autoHeight = autoWidth / Imagescale; //计算图片自适应高
}
});
var image = this.data.auto;
image[e.target.dataset.index] = {
width: autoWidth,height: autoHeight
}
console.log(image);
this.setData({
auto:image
})
},bindchange: function (e) {
this.setData({ cur: e.detail.current })
}
})
原文链接:https://www.f2er.com/weapp/417599.html