Vue 点击按钮下载txt文件

话不多少,直接上代码!!!

1.第一步,页面中给一个标签添加点击事件

下载
//注释 src:txt的网络路径
下载

2.在methods中创建函数

// 下载txt
downloadFile(url) {
  //url点击时间传过来的路径
  const link = document.createElement("a");
  fetch(HOST + url)
    //因为我的url是--->sheepFiles/79819a1de6b46766f5/abv.txt
    //没有服务器地址所以需要拼上服务器地址 HOST
    //拼接后--->http://www.xx.net/sheep/sheepFiles/79819a1de6b46766f5/abv.txt
    .then((res) => res.blob())
    .then((blob) => {
      // 将链接地址字符内容转变成blob地址
      link.href = URL.createObjectURL(blob);
      // console.log(link.href)
      link.download = "";
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    });
},

3.然后就完成了

你可能感兴趣的:(vue.js,javascript,elementui)