element上传组件自定义上传

developer.mozilla.org/zh-CN/docs/… //介绍

developer.mozilla.org/zh-CN/docs/… //使用方法

FormData 接口提供了一种表示表单数据的键值对的构造方式，经过它的数据可以使用 XMLHttpRequest.send() 方法送出，本接口和此方法都相当简单直接。如果送出时的编码类型被设为 "multipart/form-data"，它会使用和表单一样的格式。

如果你想构建一个简单的GET请求，并且通过

的形式带有查询参数，可以将它直接传递给URLSearchParams。

实现了 FormData 接口的对象可以直接在for...of结构中使用，而不需要调用entries() : for (var p of myFormData) 的作用和 for (var p of myFormData.entries()) 是相同的。

<el-upload
class="upload-demo"
action="/authorization/api/thirdSellerCenter/uploadAttach/file/upload"
:limit="1"
accept=".jpg, .png"
:http-request="uploadImg" //自定义发送请求
:before-upload="beforeAvatarUpload"
:on-change="uploadChange"
:on-remove="removeImg"
list-type="picture"
:file-list="storageImg"
>
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">
  只能上传jpg/png文件，且不超过5000kb
</div>
</el-upload>

自定义发送请求 
  
uploadImg(f) { 
    //此处可以校验文件大小
    let param = new FormData(); //创建form对象
    param.append("file", f.file); //通过append向form对象添加数据
    param.append("path", this.folder); //通过append向form对象添加数据

    this.$post("/api/thirdSellerCenter/uploadAttach/file/upload", param) //上传图片
      .then((response) => {
        f.onSuccess(response.data);
      })
      .catch(({ err }) => {
        f.onError();
      });
}