【uniapp】当图片固定宽高后比例失衡

当前端固定好宽高数值，但后台的图片太宽或太高时，只想不破坏清晰度和比例展示一部分，使用 mode="aspectFill"（已经在css中给过宽度和高度）

使用前：

使用后：

 

<image :src="item.sysAttachments[0].bigUrl" mode="aspectFill"></image>

总之：

aspectFill：保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取，长边会截取，不是完整的图片
aspectFit：保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整展示图片。
widthFix：宽度不变，高度自动变化。