mpvue小程序中图片根据自身宽高做自适应

需求：小程序因为自身上传包大小的限制（每个包2M，使用分包总共可以上传8M），所以小程序的静态资源主要是放在服务器端（主要是图片资源）。但是从服务器获取图片时有可能出现下面一种情况：

返回的是图片的url地址，但并没有图片自身的宽高  ==>>  导致结果：无法根据图片的宽高和屏幕宽度，计算得出图片的高度，从而给图片做自适应。

计算高度的方法：图片自身宽度 / 图片自身高度 = 屏幕中图片宽度 / 屏幕中图片高度      ==>>  即利用图片的宽高比

 

解决方法： 

1. 利用微信小程序API   wx.getImageInfo   获取图片的信息；

从返回的数据中获取到图片的宽高。

 

2. 根据图片自身的宽高和屏幕的宽度， 计算图片的高度。从而实现图片的自适应。

 

文章仅为本人学习过程的一个记录，仅供参考，如有问题，欢迎指出！