前端开发中vue

组件内部的js

工具类js

达到效果：

主要js源代码：

methods: {

async downloadpre{

let res=wait service . download(api . img)；

console . log(res . data)；

let type=res . data res . data . type | | " image/jpeg "；

if(！res) {

返回

}

让url=window。url.createobjecturl(新blob([res.data]，{ type : type })；

let link=document . createelement(" a ")

link.style.display="none "

link.href=url

link.setattribute("download "，" excel.webp ")

document.body.appendchild(链接)

link.click

文件。body.removechild(链接)//完成，元素被移除

window . url . revokeobjecturl(url)//释放blob对象

},

}

工具类js的主要代码：

导出函数(url，数据={ }){//文件

返回新承诺((解决，拒绝)={

axios({

method: "get "，

url: url，

数据：数据，

响应类型：“blob”

//responsetype :“array buffer”，

})。然后(响应={

解决(响应)

}).catch(函数(err){

拒绝(错误)

})

})

}

功能实现了，简单粗暴。