思路:本章内容包括移动端(ios、isAndroid)、web端;
移动端必须需要后台返回http文件路径,isAndroid可以直接跳转浏览器下载,ios需要用户手动复制链接,然后去浏览器下载,web端文件不管是 流 还是http路径都可以下载
const u = ;
const isAndroid = ('Android') > -1 || ('Adr') > -1; // android终端
const isiOS = !!(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
if (isAndroid) {
// 安卓终端使用iframe
();
} else if (isiOS) {
({
title: '请复制链接至浏览器下载',
message: ,
confirmButtonText: '复制',
}).then(() => {
clipBoard();
});
} else {
1.如果是地址
();
2.如果是文件流
// 浏览器
const aEle = ('a');
= (blob);
if (!filename) {
// 没传文件名,就用后台的filename, 后台也没有传就。。。。
filename = ['content-disposition'].split('filename=')[1];
filename = decodeURIComponent(filename || '');
}
= filename;
();
();
}
手动复制链接方法:
1.利用input标签和相结合
const input = ('input');
(input);
= text;
();
('copy');
();
安装依赖 npm install clipboard
// 在要使用的组件里引入
import Clipboard from 'clipboard' // 复制功能
<div @click="linkTap($event,link)">复制链接</div>
// 复制链接
linkTap(e, text) {
const clipboard = new Clipboard(, { text: () => text })
('success', e => {
Toast('复制成功')
})
(e)
},