vue 点击事件点击下载文件

最新推荐文章于 2025-07-17 10:56:20 发布

原创最新推荐文章于 2025-07-17 10:56:20 发布 · 1.7w 阅读

17 ·

CC 4.0 BY-SA版权

文章标签：

#vue 点击事件点击下载文件

vue 同时被 2 个专栏收录

114 篇文章

订阅专栏

66 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的文件下载方法，通过修改HTTP链接为HTTPS，并利用XMLHttpRequest对象发起GET请求，将文件作为Blob数据获取，进而创建a标签实现点击下载的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// 点击下载文件     
    downloadFile(item) {
      this.contextFile.index = -1;
      item.path = item.path.replace(/^http:/,"https:");
      this.download(item.path, item.title);
    },
    download (src, fileName) {
      let x = new XMLHttpRequest();
      x.open("GET", src, true);
      x.responseType = 'blob';
      x.onload = function(e) {
        let url = window.URL.createObjectURL(x.response)
        let a = document.createElement('a');
        a.href = url
        a.download = fileName
        a.click()
      }
      x.send();
    },