data() {return{
imgPicList: [],
imgboxtype:0,
imgwidth:0,
imgpad:0,
imgheight:''}
},
props: {
imgList: {
type: Array
},
num: {
type: Number,default: 0},
pad: {
type: Number,default: 0}
},
methods: {//图片预览
previewpic(cind, clist) {
console.log(cind, clist);
uni.previewImage({
urls: clist,
current: cind,
indicator:'default'});
},
getheight() {
let that= this;const query = uni.createSelectorQuery().in(that)
query.select('.imgitem').boundingClientRect()
query.exec(function(res) {
console.log(res[0].width)if (that.num == 1) {
that.imgheight= '100%';
}else if (that.num == 2 || that.num == 4) {
that.imgheight= (res[0].width).toFixed(2) + 'px';
}else{
that.imgheight= (res[0].width).toFixed(2) + 'px';
}
})//const query = uni.createSelectorQuery().in(this).select('.imgitem');//uni.createSelectorQuery().select('.imgitem').boundingClientRect(res => {//console.log('reac', res)//if (this.num == 1) {//this.imgheight = '100%';//} else if (this.num == 2 || this.num == 4) {//this.imgheight = (res.width).toFixed(2) + 'px';//} else {//this.imgheight = (res.width).toFixed(2) + 'px';//}//}).exec()
}
},
mounted() {//let this = this;
this.imgPicList = this.imgList;if (this.num == 1) {this.imgboxtype = 0;this.imgwidth = 100 + '%';
}else if (this.num == 2 || this.num == 4) {this.imgboxtype = 1;this.imgwidth = 49 + '%';
}else if (this.num == 3 || this.num > 4) {this.imgboxtype = 2;this.imgwidth = 32 + '%';
}this.$nextTick(function() {this.getheight();
})
}
}
.flex {
display: flex;
}
.justify {
justify-content: space-between;
}
.receiveimage {
margin-top: 28rpx;
display: flex;
flex-wrap: wrap;
width:100%;
.onepic {
width:100%;//height: 188rpx;//height: auto;
margin-bottom: 28rpx;&:nth-child(3n) {
margin-right: 0;
}
}
.doublepic {//width: 340rpx;//height: 340rpx;
margin-right: 12rpx;
margin-bottom: 12rpx;&:nth-child(2n) {
margin-right: 0;
}
}
.triplepic {//width: 222rpx;//height: 222rpx;
margin-right: 12rpx;
margin-bottom: 12rpx;&:nth-child(3n) {
margin-right: 0;
}
}
}
}
1447
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
