vue中a標簽下載本地文件-未找到【已解決】

首先

 download(url, filename) {
          return fetch(url).then(res => res.blob().then(blob => {
          console.log(res)
              let a = document.createElement('a');
              let url = window.URL.createObjectURL(blob);
              a.href = url;
              a.download = filename;
              a.click();
              window.URL.revokeObjectURL(url);
          }))
      },
    Downloads(){
    this.download('./muban.xlsx','參考模板.xlsx')
    },

Dowloads通過動態創建一個a標簽來實現下載功能，所有的地方都沒有問題，為什么會報錯

然后我搜了一下總結了一下問題所在

第一點：文件名字不可以為中文名

第二點：文件必須放在static里面，但是由於vue3.0版本static取消，文件可以放在public里面

第三點：也是最重要的第一點，url的路徑問題，如果使用"../../public/muban.xlsx"的話，會下載一個空文件

　　　　因為此時的路徑不應該使用相對於當前vue頁面的路徑，放在public下時，應該使用相對於index.html的路徑

　　　　即"./"即可，然后就可以訪問到了

當然這是通過綁定在button上了，如果單純的使用a標簽下載的話同理

<a href="./muban.xlsx" download="模板.xlsx"></a>

這樣就可以啦~感謝觀看~