vueVue
2025-04-09 11:01阅读:92评论:0
vue中下载文件,浏览器打开新标签方式下载
表单方式 blob方式
_PROTECTED0__
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const params = { keyword: this.listSearchKey.keyword }; const formEl = document.createElement('form'); formEl.setAttribute('action', url); formEl.setAttribute('method', 'post'); formEl.setAttribute('target', '_blank'); for (let key in params) { if (params[key]) { let inptEl = document.createElement('input'); inptEl.setAttribute('type', 'hidden'); inptEl.setAttribute('name', key); inptEl.setAttribute('value', params[key]); formEl.appendChild(inptEl); } } $(document.body).append(formEl); formEl.submit(); setTimeout(function () { formEl.remove(); }, 10); _PROTECTED0__
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
downloadFile().then(res => { const link = document.createElement('a'); let blob = new Blob([res.data], { type: "application/octet-stream;charset=utf-8" }); link.style.display = 'none'; //设置连接 link.href = URL.createObjectURL(blob); link.download = '小程序二维码.jpg'; document.body.appendChild(link); //模拟点击事件 link.click(); this.fullscreenLoading = false;}).catch((err) => { console.log(err);})