img 图片标签自适应盒子, 使用object-fit属性,并兼容ie11

属性：object-fit
fill - 默认值。调整替换后的内容大小，以填充元素的内容框。如有必要，将拉伸或挤压物体以适应该对象。
contain - 缩放替换后的内容以保持其纵横比，同时将其放入元素的内容框。
cover - 调整替换内容的大小，以在填充元素的整个内容框时保持其长宽比。该对象将被裁剪以适应。
none - 不对替换的内容调整大小。
scale-down - 调整内容大小就像没有指定内容或包含内容一样（将导致较小的具体对象尺寸）

为了图片在盒子中等比例缩放，且不拉伸图片使其变形
使用 object-fit属性不兼容ie, 若不需要兼容ie,可以忽略

https://github.com/fregante/object-fit-images

安装 npm install --save object-fit-images
引入 import objectFitImages from ‘object-fit-images’

.your-favorite-image {
object-fit: contain;
font-family: ‘object-fit: contain;’;
}
objectFitImages()

若在组件内部使用，注意dom元素渲染；需将方法放在this.$nextTick(() => {})
nextTick()：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM
简单的理解是：当数据更新了，在dom中渲染后，自动执行该函数，