0


el-upload自定义手动上传方法

<el-upload
    ref="upload"
    action
    :accept="acceptFile"
    :file-list="fileList"
    :show-file-list="false"
    :on-change="handleChange"
    :auto-upload="false"
>
  <el-button class="btn-define" slot="trigger" size="small" type="primary">选取文件</el-button>
</el-upload>
<el-button type="primary" @click="saveData">保存</el-button>

 // 选择文件变化后
handleChangeQuitUpload(e) {
    this.form.uploadFile=e.raw;//上传的文件
},

data() {
    return {
        form:{
            uploadFile:null,
        },
        acceptFile:['jpg','zip','png']
    }
}

methods:{
    saveData(){
      //选取了文件则上传
      if(this.form.uploadFile){
          this.uploadHttpRequest();
      }
    }
      //上传执行的方法
    async uploadHttpRequest() {
      const formData =  new FormData() //FormData对象,添加参数只能通过append('key', value)的形式添加
      formData.append('file', this.form.uploadFile) //添加文件对象
      //发起上传请求...
    },
}

本文转载自: https://blog.csdn.net/qq_43805205/article/details/130400157
版权归原作者 barry--*/ 所有, 如有侵权,请联系我们删除。

“el-upload自定义手动上传方法”的评论:

还没有评论