方式一
1.封装方法
export const download =(res,type, filename)
const blob =new Blob([res.data],{
})
const downloadElement = document.createElement('a')
const URL =window.URL.createObiectURL(blob)
const href = URL.createObjectURL(blob)
downloadElement.href=href
downloadElement.download = decodeURIComponent(filename)
document.body.appendChild(downloadElement)
downloadElement.click()
document.body.removeChild(downloadElement)
window.URL.revokeObjectURL(href)
}
2.如何使用
const downloadFile = async () => {
const result = await $download()
download(result.data,"application/vnd.ms-excel','代码统计.x1sx')
}
方式二
1.封装 htpp 中方法
static download = (option: HttpOption) => {
return this.Request('get', {
successToast: false,
errorToast: false,
returnHttpData: true,
noCheckCode: true,
otherAxiosOption: { responseType: 'blob' },
...option
}).then((res) => {
if (res) {
const { headers } = res || {};
const contentDisposition = headers?.['content-disposition'];
let fileName = '文件下载';
if (contentDisposition) {
fileName = decodeURIComponent(
contentDisposition?.split(';')?.[1]?.split('filename=')?.[1] || ''
);
}
downloadFile(res.data, fileName);
return {};
}
});
};
2.下载文件方法
export function downloadFile(content: string, fileName: string) {
var aLink = document.createElement('a');
var blob = new Blob([content]);
aLink.download = fileName;
aLink.href = URL.createObjectURL(blob);
aLink.click();
}
3.如何使用
export const exportPDFApi = async (data?: any): Promise<any> =>
await $download({
url: `${API_FIX}/view/layout/exportPDF`,
data: data
});
import { exportPDFApi } from '@/api/***';
const exportPdfFn = (isDesp: boolean) => {
exportPDFApi({
layoutName: pdfTitle.value,
imagePath: imgPath.value,
content: pdfContent.value,
isDesc: isDesp ? 1 : 0,
});
}
常用base64常用的前缀(excel,doc,pdf,png,jpg)
.doc——data:application/msword;base64,
.docx——data:application/vnd.openxmlformats-officedocument.wordprocessingml.document;base64,
.xls——data:application/vnd.ms-excel;base64,
.xlsx——data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,
.pdf——data:application/pdf;base64,
.ppt——data:application/vnd.ms-powerpoint;base64,
.pptx——data:application/vnd.openxmlformats-officedocument.presentationml.presentation;base64,
.txt——data:text/plain;base64,
.png——data:image/png;base64,
.jpg——data:image/jpeg;base64,
.gif——data:image/gif;base64,
.svg——data:image/svg+xml;base64,
.ico——data:image/x-icon;base64,
.bmp——data:image/bmp;base64,
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 【.NET】调用本地 Deepseek 模型
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库