<el-upload action v-if="IsUpload" style="display:inline" list-type="picture-card" :on-remove="handleRemove" :on-success="onSuccess" :on-change="on_change" :before-remove="before_remove" :limit="1" :before-upload="onBeforeUpload" accept=".jpg, .png" :http-request="uploadFile" :on-exceed="Exceed" :file-list="imgUrls" > <i class="el-icon-plus"></i> <i id="uploadImg" style="position: absolute;top: 29%;left: 50%;transform: translateX(-50%);color: #F56C6C;font-size: 12px;display:none" >请上传图片</i> </el-upload>
// 上传之前的钩子
onBeforeUpload(file) { // console.log(file) const isJPG = file.type === "image/jpeg"; const isPNG = file.type === "image/png"; if (!isJPG && !isPNG) { this.$message.error("上传图片只能是 JPG/PNG 格式!"); } return isJPG || isPNG; },
// 自定义上传文件 uploadFile(file) { console.log(file); let form = new FormData(); // 后端接受参数 ,可以接受多个参数 form.append("file", file.file); this.$post( "/admin/sys-file/uploadImg", form, res => { }, err => { this.$message.error(err.msg); throw err; } ); },
// 移出之前钩子 before_remove(a, b) { console.log(a, b); // console.log( b.findIndex(item => item.uid == a.uid)) this.count = b.findIndex(item => item.url == a.url); },