display:flex 下图片变形问题

今天写flex布局时发现图片设置了宽高
但是图片还是会变形

期望效果

实际效果

解决方案
在图片的css中添加

.cell-box .my-cell .cell-value .point_icon {
  width: 40rpx;
  height: 50rpx;
  flex-shrink: 0; //  <-
  margin-right: 8rpx;
}

flex-shrink

指定了 flex 元素的收缩规则
默认值为1 不想缩放设置为0就可以了
当宽度超出时会更具flex-shrink的属性值进行计算

点击查看详细说明