vue | vant swipe轮播图片宽高会被拉伸或显示不全的问题

一、问题

显示不全时： 没有设置css代码

拉伸时：代码：

::v-deep .van-image {
	height: 100%;
	width: 100%;
}

二、解决

::v-deep .van-image {
	height: 100%;
	width: 100%;
	img {
		height: 100%;
		width: 100%;
		object-fit: contain;
	}
}

 object-fit: contain 保持图片原有尺寸比例。内容被缩放。

知识点：CSS object-fit 属性 | 菜鸟教程

效果：