Element UI Upload 组件 limit 限制上传文件,造成第二次后无法上传的坑和如何设置 限制上传文件大小

1,849 阅读1分钟

在使用 elementui upload 上传文件组件的时候,一般会设置个 limit 来控制上传的数量,而当我们来设置上传大小时,就会碰到虽然设置限制文件成功了,但是当发送超出文件大小的提示的时候会发现因为设置了 limit 属性,导致不能再次继续上传了,是因为浏览器保存着。这时候可以使用通过ref 拿到它的document元素进行清除已经上传的文件

this.$refs.upload.clearFiles() // 清除浏览器保存的上传文件

限制上传文件大小的代码是:

FileChange(file, fileList) {
      if(Number(file.size/1024/1024) > 5){
          this.$message.error('文件大小不能超过 5 MB,请重新上传')
          this.$refs.upload.clearFiles() // 清除浏览器保存的上传文件
          return 
      }
}

file.size 除以1024kb 为单位的数值,file.size除以俩次1024MB 的数值

file.size/1024 是 kb file.size/1024/1024 是 MB