在開發(fā)的過程飒责，我們都會遇到的一個問題赘娄，設計稿給的寬高大小與server返回的img可能并不符。
例如：設計稿：80*120宏蛉，但是server返回的img有200*80的遣臼，也有60*150的，而產(chǎn)品的同學要求無論什么樣的圖片拾并，都不允許顯示空白揍堰。
這就需要獲取圖片的大小，如何獲取呢嗅义？
首先：創(chuàng)建img對象屏歹，待圖片加載結束，獲取圖片的真實大小之碗。
代碼： setHeight: function () {
? ? ? ? ? ? const that = this;
? ? ? ? ? ? const img = new Image();
? ? ? ? ? ? let w;
? ? ? ? ? ? let h;
? ? ? ? ? ? if (this.data.photoCover) {
? ? ? ? ? ? ? ? img.src = this.data.photoCover;
? ? ? ? ? ? ? ? img.onload = function () {
? ? ? ? ? ? ? ? ? ? w = img.width;
? ? ? ? ? ? ? ? ? ? h = img.height;
? ? ? ? ? ? ? ? ? ? console.log(w / h);
? ? ? ? ? ? ? ? ? ? if (w / h > 0.74) {
? ? ? ? ? ? ? ? ? ? ? ? that.imgH = 1.87 + 'rem';
? ? ? ? ? ? ? ? ? ? } else {
? ? ? ? ? ? ? ? ? ? ? ? that.imgH = 1.4 * h / w + 'rem';
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? };
? ? ? ? ? ? }
? ? ? ? },
然后將imgH動態(tài)綁定的img標簽上：
<img :src=""? :style=""{height: imgH}>?
我是前端小菜鳥蝙眶，有簡單的方法歡迎大佬們指導呀！
