el-upload custom manual upload method

 

<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) //添加文件对象
      //发起上传请求...
    },
}

Guess you like

Origin blog.csdn.net/qq_43805205/article/details/130400157