Vue 文件下载 a标签文件下载 window.open window.location.href

tanzongbiao

已于 2023-07-08 00:25:41 修改

阅读量527

点赞数

文章标签： vue.js javascript 前端

于 2023-07-08 00:22:02 首次发布

本文链接：https://blog.csdn.net/tanzongbiao/article/details/131606458

版权

<el-button-group class="right-btn">
  <a style="color:red" @click="templateDownload">模板下载</a>
  <!-- a标签直接下载会导致地址栏变化 -->
  <!-- <a :href="`http://www.xxx.com/template/excel/Excel导入--标准模板.xlsx`" download style="color:red">模板下载</a> -->
</el-button-group>

// 模板下载
templateDownload() {
  // 这种方式原地址栏不会被影响
  window.open(`http://www.xxx.com/template/excel/Excel导入--标准模板.xlsx`)
  // 这种方式地址栏也会变
  // window.location.href = `http://www.xxx.com/template/excel/Excel导入--标准模板.xlsx`
}

参考：

前端vue中实现文件下载的几种方法总结_vue.js_脚本之家

前端Vue项目中点击a标签实现下载文件到本地的功能_vue下载文件到本地_AiGarry的博客-CSDN博客

vue 中文件下载方式总结_vue 下载文件_huanxin_94的博客-CSDN博客