点击数据导出下载指定文件模板
例如:统计用户数据信息,点击按钮下载用户数据模板
第一种场景下载固定模板,使用a标签自带的下载功能;
<a @click.stop download href="服务器文件地址.xlsx"><el-button type="text">下载模板</el-button></a>
第二种场景下载模板,数据为后端穿过来的文件流;
axios({
method: 'post',
url: `//文件地址,一般使用拼接形式,防止项目上线后地址更改文件失效`,
responseType: 'blob', //首先要指定格式类型,在请求中加入
data: {
...this.searchForm, //传递的文件类型参数
planNo: this.row, //文件编码
},
headers: {
// 自行封装跟后端约定好的请求加密信息
},
}).then(res => {
请求成功数据后,对数据进行加工
//获取文件流后
const blob = new Blob([res.data]) //创建实例对象
const fileName = "指定文件名称.xls" //约定指定文件名称
const linkNode = document.createElement("a") //创建a标签利用a标签下载功能的特性
linkNode.download = fileName //a标签的download属性规定下载文件的名称
linkNode.style.display = "none"
linkNode.href = URL.createObjectURL(blob) //生成一个Blob URL
document.body.appendChild(linkNode)
linkNode.click() //模拟在按钮上的一次鼠标单击
URL.revokeObjectURL(linkNode.href) // 释放URL 对象
document.body.removeChild(linkNode)
this.loading = false
this.$message.success('导出记录成功!')