vue中使用a标签下载静态资源文件(比如excel、pdf等)后端不参与

原文:vue中使用a标签下载静态资源文件(比如excel、pdf等)后端不参与 - 知乎 (zhihu.com)

可以使用如下代码实现:

1.模板中:

<a :href="downloadUrl" download target="_blank">下载文件</a>

2.在 data 中定义 downloadUrl 属性和文件名:

data () {
  return {
    downloadUrl: '',
    fileName: '' // 文件名
  }
}

3.在方法中设置 downloadUrl 的值:

methods: {
  onDownload () {
    this.downloadUrl = '/static/files/' + this.fileName + '.pdf'
  }
}

在这个例子里,静态文件存储在 /static/files/ 下,可以通过 this.fileName 属性来控制下载的文件名。当用户点击下载链接时,浏览器会自动下载指定的文件。

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-05 18:42:04       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-05 18:42:04       100 阅读
  3. 在Django里面运行非项目文件

    2023-12-05 18:42:04       82 阅读
  4. Python语言-面向对象

    2023-12-05 18:42:04       91 阅读

热门阅读

  1. eclipse jee中 如何建立动态网页及服务的设置问题

    2023-12-05 18:42:04       55 阅读
  2. 查看linux处理器架构(uname命令 使用指南)

    2023-12-05 18:42:04       53 阅读
  3. Vue 打包上线后的缓存问题

    2023-12-05 18:42:04       64 阅读
  4. AJAX的基础知识点

    2023-12-05 18:42:04       65 阅读
  5. 03-微服务架构构建之微服务拆分

    2023-12-05 18:42:04       63 阅读
  6. 23种设计模式【C#代码举例】

    2023-12-05 18:42:04       50 阅读
  7. 利用jQuery实现AJAX定时刷新局部页面实例

    2023-12-05 18:42:04       72 阅读
  8. 蓝桥杯ACwing习题

    2023-12-05 18:42:04       51 阅读
  9. Django回顾4

    2023-12-05 18:42:04       37 阅读
  10. Django 用户验证与权限管理

    2023-12-05 18:42:04       64 阅读