uni-app如何解决微信小程序给图片设置固定宽高但发生变形的问题

前端小白的uni-app艰难学习之路

问题

在开发过程中我发现，有时会遇到明明图片宽高设置的是相同的值，但在运行后图片却并没有显示出相对应的效果，反而看起来宽高非常不成比例，如以下示例：


最终效果：

可以看到，这并不是我们想要的结果，经过我反复调试，最后发现想要达到我们预期的效果（宽高相等即为正圆或正方形）也是非常简单的！

解决

第一步： 我们需要给图片加一个父view组件（一开始我也是没有的），然后给父view的宽设置成百分比
第二步： 给图片固定宽高

最终我们的效果显示：