简介: el-upload上传一张图片后显示缩略图并隐藏添加图片按钮 上传前: 上传类型不通过 正确上传后 点击删除后 不想了解原理的直接copy这个完整demo按需修改 import { ElDialog, UploadProps, UploadFile, ElMessage } from "element-plus" import { ref } from "vue" const validImageFormats = ["jpg", "...
::v-deep.el-upload-list__item{img{object-fit:contain;}} 图片按照比例显示
2. 我们通过定制el-upload的列表样式,为不同类型的文件设置了不同的展示方式。对于图片文件,我们显示文件的缩略图;对于视瓶文件,我们显示视瓶的封面图;对于音频文件,我们显示音频的波形图。通过这样的定制化列表样式,使得上传文件的展示更加生动和有趣。 3. 在另一个企业管理系统的项目中,我们需要实现一个文件上传...
2、需要进行一个缩略图删除。 这个过程发现的问题:1、缩略图显示的是一个数组列表 2、上传的文件其实又是一个数组 上代码: {{ "上传图片" }} <el-upload action="" list-type="picture-card" ref="uploadImage" :on-change="uploadImgChange" :on-exceed="uploadImgExceed" accept=".png,jpg,.jpe...