html2Canvas截图出来的图片变形问题

场景：在利用html2Canvas截图导出PDF时，图片变形问题。

固定图片的宽高，设置object-fit属性，使得图片能够自适应。

通过html2Canvas截图的时候，是不支持object-fit属性，所以截下来的效果就是变形的

但是既然不支持object-fit属性，图片宽度自适应还有其他方法解决

.path-img {
    width: 305px;
    height: 305px
}
.img {
    max-width: 100%;
    max-height: 100%;
}

<div class="path-img" style="width: 305px;height: 305px">
    <img
      src="图片路径" 
      class="img"
    />
</div>

通过其他方法来解决图片自适应，再用html2Canvas截图的时候图片就不会变形了

示例图就是通过其他方法解决图片自适应来解决html2Canvas不能兼容的属性1：1还原。

有时候遇到问题不用慌，或者还一种思路就能有解决的方案