前端文件上传与下载

下载，核心就是在按钮处创建a标签，将接口返回的地址赋到href上。

api.接口号(params).then(res=>{
	let link = document.createElement('a')
	link.style.display ='none'
	link.href = res.body.url
	link.download = res.body.fileName
	document.body.appendChild(link)
	link.click()
	document.body.removeChild(link)
	this.$messag.success('下载成功')
})

如果下载的时候，后端返的是文件流

async imp(){
	let res = await this.$http('接口号',params,'blob')
	const blob = new Blob(res.data)
	const bUrl = window.URL.sreatedObjectURL(blob)
	let link = document.createElement('a')
	link.style.display ='none'
	link.href = bUrl
	document.body.appendChild(link)
	link.setAttribute('download','qwe.xlsx')
	link.click()
	document.body.removeChild(link)
}

上传，核心是创建一个表单对象（formData），将选中的文件通过接口上传后，接口会返回一个地址，将地址保存并再次传给后端。

//这里是ele的上传文件示例，此事件绑定在上传组件的http-request属性上，可以自定义上传事件
httpRequest(params){
	let formData = new FormData()
	formData.append('uploadFileList',param.file)
	this.$http.upload('接口号',formData).then(res=>{
		res = res.data
		//errcode == 0 
		param.onsuccess
		console.log(res.body.path)
	})
}