有时候动态加载图片,会因为图片宽高导致显示拉伸情况,如果能根据图片URL地址获取到图片的宽高,再进行渲染,就可以了,以下两种方案供参考:
方法一:
// 图片地址
var imgUrl = "line.jpg";
// 实例对象
var img = new Image();
// 赋值图片地址
img.src = imgUrl;
// 输出对象信息
console.log('width:' + img.width + ',height:' + img.height);
方法二:
getImgWidth('line.jpg').then((res) => {
console.log(res)
})
function getImgWidth(imgUrl) {
return new Promise((resolve, reject) => {
let img = new Image()
let obj = {}
img.onload = function() {
obj = {
width: this.width,
height: this.height,
}
resolve(obj)
}
img.src = imgUrl
})
}