在 el-upload 组件上传多个文件并提交保存后,可以通过以下步骤清空已上传的文件:
1.在 el-upload 组件上添加 ref 属性,例如:<el-upload ref="upload"></el-upload>
2.在保存成功后,通过 this.$refs.upload.clearFiles() 方法清空已上传的文件。
完整示例代码如下:
<template>
<el-upload
ref="upload"
action="/upload"
multiple
:on-success="handleSuccess"
>
<el-button slot="trigger">选择文件</el-button>
</el-upload>
</template>
<script>
export default {
methods: {
handleSuccess(response, file, fileList) {
// 提交保存成功后清空已上传的文件
this.$refs.upload.clearFiles();
}
}
};
</script>
注意:clearFiles() 方法只会清空已上传的文件,而不会清空待上传的文件队列。如果需要同时清空待上传的文件队列,可以使用 clearQueue() 方法。