vue下载PDF文件到本地

方法1.

复制代码
downloadPDF(fileName) {
  // 要下载的文件路径
  var fileUrl = './file/' + fileName;
  // 创建一个隐藏的<a>元素,用于下载文件
  var a = document.createElement('a');
  a.href = fileUrl;
  a.download = fileName; // 可以自定义下载文件的名称
  a.style.display = 'none';
  // 将<a>元素添加到页面上
  document.body.appendChild(a);
  // 触发点击事件,开始下载
  a.click();
  // 下载完成后,移除<a>元素
  document.body.removeChild(a);
}
复制代码

方法2.

复制代码
downloadPDF(fileName) {
  const fileUrl = './file/' + fileName; // 替换为实际的文件路径
  fetch(fileUrl).then(response => response.blob()).then(blob => {
    // 创建一个临时的URL对象
    const url = URL.createObjectURL(blob);
    // 创建一个隐藏的<a>标签,并设置其href属性为临时URL
    const a = document.createElement('a');
    a.href = url;
    a.download = fileName; // 设置下载的文件名
    a.style.display = 'none';
    // 将<a>标签添加到文档中,并模拟点击下载
    document.body.appendChild(a);
    a.click();
    // 下载完成后,移除<a>标签和临时URL对象
    document.body.removeChild(a);
    URL.revokeObjectURL(url);
  }).catch(error => {
    console.error('下载文件时出错:', error);
  });
}
复制代码

 

posted @   借你耳朵说爱你  阅读(2672)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛(1)
点击右上角即可分享
微信分享提示