element upload文件自定义上传

<!--文件上传组件-->
<el-dialog title="上传" :visible.sync="dialogFormVisible2" :before-close="closeFileUploadDialog">
      <el-form :model="uploadForm">
        <el-form-item label="">
          <el-upload  ref="uploadForm" action=""  :multiple="false" :file-list="fileList" :before-upload="beforeUpload"
           	:on-change="handleFileChange" :on-remove="handleRemove"
           	:http-request="uploadFile" :auto-upload="false">
            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
            <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeFileUploadDialog">取 消</el-button>
        <el-button type="primary" @click="dialogFormVisible2 = false">确 定</el-button>
      </div>
</el-dialog>

 

　　

//上传文件，获取文件流
handleFileChange(file) {
   console.log(file);
   this.file = file.raw
},
handleRemove(file, fileList) {
	this.file = '';
},
beforeUpload(file) {

},
submitUpload() {
	if (this.file != '') {
		this.$refs.uploadForm.submit();
	} else {
		this.$message({
			message: '请先选择文件!',
			type: 'warning',
			duration: '2000'
		});
	}
},
deleteFile(savedPath) {
	this.$axios({
		url: "/api/test/deleteFile",
		method: "post",
		data: {
			"savedPath": savedPath
		}
	}).then((response) = >{
		console.log('res delete=>', response);
		this.editForm.qualificationScan = '';
		this.styleObj1 = {
			display: 'none'
		};
		this.styleObj2 = {
			display: 'inline'
		};
		this.file = '';
		this.fileList = [];
	}).
	catch(response = >{
		console.log(response)
	});
},
downloadFile(savedPath) {
	alert(savedPath);
	this.$axios({
		url: "/api/test/downloadFile",
		method: "get",
		params: {
			"savedPath": savedPath
		},
		//responseType: 'blob'
		responseType: "arraybuffer"
	}).then((response) = >{
		console.log('res download=>', response);
		const _res = response.data;
		console.log('res download=>', _res);
		let blob = new Blob([_res], {
			type: "application/x-png;charset=UTF-8"
		});
		let downloadElement = document.createElement("a");
		let href = window.URL.createObjectURL(blob); //创建下载的链接
		downloadElement.href = href;
		downloadElement.download = "test.png"; //下载后文件名A
		document.body.appendChild(downloadElement);
		downloadElement.click(); //点击下载
		document.body.removeChild(downloadElement); //下载完成移除元素
		window.URL.revokeObjectURL(href); //释放掉blob对象*/
		/*var src='data:image/jpg;base64,'+ btoa(new Uint8Array(_res.data).reduce((data, byte) => data + String.fromCharCode(byte), ''));
            this.srcImg = src; //图片回显
            var link = document.createElement('a');
            link.href = src;
            link.download = "qrCode.png";
            link.click();
            //document.body.removeChild(link); //下载完成移除元素
           // window.URL.revokeObjectURL(link);//释放掉blob对象*/
	}).
	catch(response = >{
		console.log(response)
	})
},
// 自定义上传
uploadFile() {
	let index = this.file.name.lastIndexOf(".");
	let suffix = this.file.name.substr(index + 1);
	// 创建表单对象
	let formData = new FormData();
	// 后端接受参数 ，可以接受多个参数
        formData.append("file", this.file);
        formData.append("uploadFileName","git");
        formData.append("uploadFileContentType", suffix);
        this.$axios({
		url: "/api/test/uploadFile",
		method: "post",
		data: formData,
	}).then((response) = >{
		console.log('res=>', response);
		var res = response.data;
		if (res.succ == "ok") {
			this.editForm.qualificationScan = res.msg;
			this.dialogFormVisible2 = false;
			this.styleObj1 = {
				display: 'inline'
			};
			this.styleObj2 = {
				display: 'none'
			};
			this.$message({
				message: this.$t('common.uploadSucess'),
				type: 'success',
				duration: '2000'
			});
		} else {
			this.$message({
				message: this.$t('common.uploadFail'),
				type: 'error',
				duration: '2000'
			});
		}
	})
},
closeFileUploadDialog() {
	this.dialogFormVisible2 = false;
	this.file = '';
	this.fileList = [];
},
showFileUpload(type) {
	this.dialogFormVisible2 = true;
	this.file = '';
}