This commit is contained in:
cookfront 2017-03-07 10:30:32 +08:00
parent 79ca7631e0
commit 0ba9333634
3 changed files with 27 additions and 27 deletions

View File

@ -29,9 +29,9 @@
}, },
style() { style() {
const padding = `${this.gutter / 2}px`; const padding = `${this.gutter / 2}px`;
return this.gutter ? return this.gutter
{ paddingLeft: padding, paddingRight: padding } : ? { paddingLeft: padding, paddingRight: padding }
null; : null;
} }
} }
}; };

View File

@ -47,30 +47,30 @@ export default {
* 根据屏幕自适应显示最长边 * 根据屏幕自适应显示最长边
*/ */
computeImageStyle() { computeImageStyle() {
const previewSize = this.$refs.previewContainer.getBoundingClientRect(); // const previewSize = this.$refs.previewContainer.getBoundingClientRect();
const img = new Image(); // const img = new Image();
const _this = this; // const _this = this;
img.onload = function() { // img.onload = function() {
const imgRatio = parseFloat(this.width / this.height); // const imgRatio = parseFloat(this.width / this.height);
const previewRatio = parseFloat(previewSize.width / previewSize.height); // const previewRatio = parseFloat(previewSize.width / previewSize.height);
if (previewRatio <= imgRatio) { // if (previewRatio <= imgRatio) {
const top = (previewSize.height - parseInt(previewSize.width / imgRatio, 10)) / 2; // const top = (previewSize.height - parseInt(previewSize.width / imgRatio, 10)) / 2;
_this.imageStyle = { // _this.imageStyle = {
width: '100%', // width: '100%',
height: 'auto', // height: 'auto',
top: top + 'px' // top: top + 'px'
}; // };
} else if (previewRatio > imgRatio) { // } else if (previewRatio > imgRatio) {
_this.imageStyle = { // _this.imageStyle = {
width: 'auto', // width: 'auto',
height: '100%' // height: '100%'
}; // };
} // }
}; // };
img.src = this.image; // img.src = this.image;
}, },
close() { close() {

View File

@ -20,9 +20,9 @@
style() { style() {
const gutter = Number(this.gutter); const gutter = Number(this.gutter);
const margin = `-${gutter / 2}px`; const margin = `-${gutter / 2}px`;
return gutter ? return gutter
{ marginLeft: margin, marginRight: margin } : ? { marginLeft: margin, marginRight: margin }
{}; : {};
} }
} }
}; };