elementui clearfiles

清除上传文件的方法

在Element UI中，清除上传组件（el-upload）的文件列表可以通过调用组件的clearFiles方法实现。该方法会清空已上传和待上传的文件列表。

基本用法

通过ref获取el-upload组件实例，调用clearFiles方法：

<template>
  <el-upload ref="uploadRef" action="/upload" :auto-upload="false">
    <el-button slot="trigger">选择文件</el-button>
    <el-button @click="clearFiles">清除文件</el-button>
  </el-upload>
</template>

<script>
export default {
  methods: {
    clearFiles() {
      this.$refs.uploadRef.clearFiles()
    }
  }
}
</script>

动态绑定文件列表

如果需要更精确控制文件列表，可以绑定file-list属性并使用v-model或手动清空数组：

<template>
  <el-upload
    ref="uploadRef"
    action="/upload"
    :file-list="fileList"
    :auto-upload="false"
  >
    <el-button slot="trigger">选择文件</el-button>
    <el-button @click="fileList = []">清除文件</el-button>
  </el-upload>
</template>

<script>
export default {
  data() {
    return {
      fileList: []
    }
  }
}
</script>

注意事项

• 该方法不会取消正在进行的上传请求，需要额外处理上传中的文件
• 清除后不会触发on-change事件
• 对于手动上传模式（auto-upload=false），清除操作会移除所有待上传文件