Vueプロジェクトのタグからローカルファイルをダウンロードするときの「失敗したファイルが見つかりません」の問題を解決します

1. non-vueプロジェクト：通常の状況では、ローカルファイルを現在のフォルダーに配置することに慣れており、通常どおりダウンロードできます。

2. Vueプロジェクト：ローカルファイルを現在のフォルダーに配置しましょう

タイトルに記載されているエラーは次のように表示されます。 

 解決策：ローカルファイルを静的フォルダーに配置します。問題ありません。

方法1：引き続きaタグを使用する

 <el-button>
      <a href="../../../static/解决vue上传数据模板.xlsx" download>下载</a>
 </el-button>

aタグには独自のクリックスタイルがあり、独自のボタンのスタイルに影響を与える可能性があるため、2番目のタグを使用できます。

方法2：クリックイベント

 

  <el-button  @click="downloadExcel"  type="primary">
      下载导入模板
  </el-button>

  downloadExcel() {
      // // window.location.href="http://localhost:80/static/解决vue上传数据模板.xlsx" ; 
       window.location.href="/static/解决vue上传数据模板.xlsx.xlsx"

  },

 どちらも同じ効果があり、結果は次のとおりです。

この時点で、問題は解決されました。