element ui文檔中沒有明確說明如何自定義上傳圖片后顯示效果,可以通過css的object-fit來控制圖片展示效果
css object-fit相關屬性說明
英文:https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
中文:https://element.eleme.cn/#/zh-CN/component/image
代碼示例
<el-upload
:action="uploadUrl"
:data="uploadKey"
list-type="picture-card"
:file-list="addform.img_list"
:on-success="up_dt_success"
:on-remove="up_dt_remove"
:on-preview="up_img_preview"
>
<i slot="default" class="el-icon-plus"></i>
</el-upload>
<style>
.el-upload-list__item-thumbnail {
/* 圖片在方框內顯示長邊 */
object-fit: contain;
}
</style>
image.png