vue2 el-upload上传多个文件提交保存后怎么清空文件

在 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() 方法。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容