vue中关闭弹窗，怎么手动删除el-upload已上传的文件，并清空上传文件列表

在Vue中关闭弹窗时手动删除el-upload已上传的文件，并清空上传文件列表，可以使用以下步骤：

1. 在关闭弹窗前记录已上传的文件信息，包括文件名、文件地址等。

2. 在关闭弹窗时，手动删除已上传的文件。可以通过发起AJAX请求将文件从服务器上删除，或者通过发送DELETE请求将文件从el-upload组件的文件列表中删除。

3. 清空上传文件列表。可以通过设置el-upload组件的文件列表为空数组来清空上传文件列表。

下面是一个示例代码，实现了在关闭弹窗时手动删除el-upload已上传的文件，并清空上传文件列表的功能：

<template>
  <el-dialog :visible.sync="dialogVisible" title="上传文件">
    <el-upload
      ref="upload"
      class="upload-demo"
      :action="uploadUrl"
      :on-success="handleUploadSuccess"
      :file-list="fileList"
      :auto-upload="false"
      :show-file-list="true"
    >
      <el-button slot="trigger" type="primary">选取文件</el-button>
      <el-button slot="append" type="primary" @click="handleUpload">上传</el-button>
    </el-upload>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="handleClose">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      fileList: [],
      uploadedFiles: []
    };
  },
  methods: {
    handleUploadSuccess(response, file, fileList) {
      let uploadedFile = { name: file.name, url: response.url };
      this.uploadedFiles.push(uploadedFile);
    },
    handleUpload() {
      this.$refs.upload.submit();
    },
    handleClose() {
      // 手动删除已上传的文件
      this.uploadedFiles.forEach(file => {
        this.$http.delete(file.url).then(() => {
          console.log('文件删除成功');
        }).catch(() => {
          console.log('文件删除失败');
        });
      });
      // 清空上传文件列表
      this.fileList = [];
      this.uploadedFiles = [];
      this.dialogVisible = false;
    }
  }
};
</script>

在上述示例代码中，我们通过定义一个`uploadedFiles`数组来记录已上传的文件信息。在上传成功回调函数中，将上传的文件信息添加到`uploadedFiles`数组中。

在关闭弹窗时，我们遍历`uploadedFiles`数组，通过发送DELETE请求将文件从服务器上删除。然后，我们通过将`fileList`和`uploadedFiles`数组都清空来清空上传文件列表。最后，关闭弹窗。