elementui上传组件 before-upload返回false自动调用before-remove和on-remove钩子问题解决方法
<el-uploadclass="upload-demo"ref="upload"action="/datastatistics/file/upload":on-remove="handleRemove":on-success="uploadSuccess":on-error="uploadFaild".
·
<el-upload
class="upload-demo"
ref="upload"
action="/datastatistics/file/upload"
:on-remove="handleRemove"
:on-success="uploadSuccess"
:on-error="uploadFaild"
:before-remove="beforeRemove"
multiple
:limit="1"
:on-exceed="handleExceed"
:before-upload="beforeUpload"
:headers="headers"
:file-list="fileList">
<el-button slot="trigger" size="small" type="primary" icon="el-icon-upload">点击上传</el-button>
<el-button type="success" @click="submit" icon="el-icon-document" style="margin-left: 100px">导入
</el-button>
</el-upload>
当上传的时候判断上传文件的类型不通过的时候,会触发before-remove,接着触发on-remove方法,解决办法就是,在删除的时候判断下,该文件是不是已经成功上传,如果是的话才可以删除:
beforeUpload(file) {
let extension = file.name.substring(file.name.lastIndexOf('.') + 1);
const acceptFiles = ["xls", "xlsx"];
if (acceptFiles.indexOf(extension) == -1) {
this.$message.warning('只能上传EXCEL格式的文件');
return false;
}
},
//删除文件之前
beforeRemove(file, fileList) {
if (file && file.status==="success") {
......
}
},
//删除文件
handleRemove(file, fileList) {
if (file && file.status==="success") {
......
}
},
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)