在vue中使用a链接下载项目中的文件

最新推荐文章于 2024-05-01 01:08:38 发布
最新推荐文章于 2024-05-01 01:08:38 发布
阅读量7.1k 收藏 11
点赞数 3
分类专栏： 遇到的问题以及知识点
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/poppy995/article/details/102756517
版权
在vue中使用a链接下载项目中的文件<a href="../../../static/demo.xls" download="导入模板.xls">点击此处下载模板</a>会出现文件不存在的问题，将需要下载的文件放在static中...
摘要由CSDN通过智能技术生成

vue cli 2.0 建的项目
在vue中使用a链接下载项目中的文件

<a href="../../../static/demo.xls" download="导入模板.xls">点击此处下载模板</a>

会出现文件不存在的问题，将需要下载的文件放在static中

vue cli 3.0 建的项目

将需要下载的文件放在public中

最低0.47元/天 解锁文章
我今年六岁
关注
  • 3
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端Vue项目中点击a标签实现下载文件到本地的功能
AiGarry的博客
04-20 1万+
1、根据后台提供的接口url下载文件到本地 <a :href="后台给接口提供的文件的url地址">点击下载文件</a> 2、通过a标签的download属性进行下载，下载文件到本地 <a href="文件的地址" download>点击下载文件</a> ①如果是图片或者是pdf文件，会直接在浏览器中打开，word或者是excel文件会下载到本地 ②如果download不给值，会使用默认的文件名 ...
vue 点击a链接 实现url下载文件
weixin_44168929的博客
02-15 3809
首先介绍一种 创建a链接的方式下载文件 const a = document.createElement('a') // 这里是将url转成blob地址， fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址 a.href = URL.createObjectURL(blob) a.download = name || '' // 下载文件的名字 document.bod
vue a链接点击下载文件
热门推荐
ic_xcc的博客
11-09 2万+
vue前端点击某个a便签需要下载对应文件代码，href为下载路径，download为下载文件名 <a href="./static/file/上传文件字段要求.docx" download="下载时文件名.docx">点击显示名</a> 其中下载文件路径放在公共文件夹下 ...
【vue】vue中下载文件的方法_vue下载文件
最新发布
2401_84412194的博客
05-01 1294
在浏览器端，实现直接下载文件，就是使用a标签来只想文件的下载地址。window.location.href的本质也是这样，因此在拿到二进制文件对应的Blob对象后，需要为这个Blob对象创建一个指向它的下载地址的URL。FileReader 对象也可以使得我们对 Blob 对象生成一个下载地址 URL，它和 URL.createObject 一样可以接收 File 或 Blob 对象。，前者用于将Blob或File对象转为对应的URL，后者用于接收前者完成后的URL，它会在。这个过程，主要由两个函数完成。
多行文本溢出，本地测试可以实现，打包后不起作用
weixin_45115895的博客
12-14 184
vue项目中有实现多行文本溢出的需求，本地测试完全没问题，一打包发布版本后就失效，代码如下： text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; 经多方原因查找，发现是打包时一些带有前缀的css样式被删除了，这个插件会根据浏览器删除掉一些它认为不必要的前缀，导致我们没有达到预期效果，网上有两种解决方案： 一：手动设置样式,添加下面注释的两行代码，这样打包时就不会被删掉了
vue 中从后端获取到文件的 url 地址,前端根据 url 地址下载文件
YZRHANYU的博客
03-15 1万+
vue 之从后端获取到文件的 url 地址,前端根据 url 地址文件下载
vue前端获取项目下的静态资源文件夹中的文件并下载
我的博客
04-07 3469
前端项目/public/static/image文件夹下。项目中获取这两张图片。
在vue中使用axios实现post方式获取二进制流下载文件(实例代码)
10-15
在Vue.js应用中，使用axios库来实现POST方式获取二进制流并下载文件是一个常见的需求，特别是当需要从服务器获取如Excel、PDF等特定格式的...在Vue项目中，通过将axios注入到原型链，可以更方便地在各个组件中使用。
Vue 中批量下载文件并打包的示例代码
10-18
这样，用户点击“批量下载”按钮后，Vue应用将依次下载指定路径的文件，压缩成一个ZIP文件，最后使用File-Saver库在用户的浏览器中保存这个压缩文件。 总结来说，实现Vue中批量下载文件并打包的核心步骤包括：使用...
vue excel上传预览和table内容下载到excel文件中
10-15
在Vue项目中实现Excel文件的上传预览以及将表格（table）内容下载为Excel文件，主要涉及的技术有前端文件操作、文件读取API、以及XLSX库的使用。以下是对这一过程的详细说明： 首先，为了实现Excel的上传预览，你...
在django项目中导出数据到excel文件并实现下载的功能
09-17
在Django项目中导出数据到Excel文件并实现下载功能是一项常见的需求，这通常涉及到后端数据处理和前端用户交互。以下将详细讲解这个过程的关键步骤和涉及的技术点。 首先，我们需要安装必要的依赖模块，这里是`xlwt...
vue项目消息链接全局创建监听
05-24
在Vue项目中，实现全局的消息链接监听主要涉及到了WebSocket技术，这是一种双向通信协议，允许客户端与服务器之间实时、高效地交换数据。以下是对标题和描述中所述知识点的详细说明： 1. **Vue.js**：Vue.js 是一个...
vue实现文件上传，下载到本地（简单的方式）
mkijnbgt的博客
12-09 1343
二、文件的上传 formdata。我这里是调用的Ant-table表格数据。
vue3利用 a 标签，文件流，JSZip 压缩包，实现文件下载
MoXinXueWEB的博客
09-07 5758
小菜鸟在摸鱼
vue a标签实现下载本地文件
PrimaryColor
11-03 823
<a class="active_t" href="./开店1(1).xlsx" download="开店的excel模板" style="margin-left:10px;line-height:35px;color:blue;"> 下载开店的excel模板 </a> 存放在public目录下就行了：
vue使用a标签下载文件_Vue a标签实现点击下载，下载图片、txt文件，不是直接打开的方式...
weixin_39536630的博客
12-20 2563
前段时间在项目中遇到文件需要下载，直接拿出了之前封装的下载指令，在用的时候发现在下载jpg、txt文件时，并不会直接下载，而是会在浏览器中打开文件，即使给a标签添加了download属性，也无济于事。我先把之前封装的指令贴出来吧，如果下载文件类型只是Exact、Word、Pdf格式的可以直接拿着用，如果有其他文件类型需求的，可以继续往文章下面看支持Exact、Word、Pdf格式下载let bas...
Vue学习-如何在vue项目中通过a标签 download 下载本地文件
qq_43762607的博客
05-23 3207
如何在vue项目中通过a标签 download 下载本地文件？ 一般来说我们会将vue项目的静态资源放在src的assets目录下。但如果我们将需要下载的，例如doc文件放在同样的目录下就会出现下载失败，找不到目标文件的错误。 其实只需要将需要下载的文件放在public，也就是和index.html文件一个文件夹下即可，如下图： 然后在需要进行点击下载文件的地方添加如下代码： <a href="./需要下载的文件名" download>点击下载</a> 就可以实现下载啦。 ..
Vue——vue中文件下载的几种方式
qq_43201350的博客
08-30 3486
方式一： 利用a标签创建超链接 href 内是下载路径 download也可以不给值，这样就会使用默认的文件名 <a href="../../../static/images/demo.jpg" download="下载demo.jpg">点击下载</a> 方式二 ： 创建div标签，动态创建a标签： <div name="downloadfile" @click="downloadExcel">下载</div> downloadExcel() {
如何使用a标签或者按钮点击下载文件
哆啦A梦的百宝袋的博客
05-22 1万+
本人在做一个项目管理系统时需求点击按钮下载文件，测试多种方法下载出来的文件都是损坏。查询多个文章，找到在我使用时的具体的bug问题。（如果不是新手可直接跳转到问题解决模块）
vue 使用axios下载文件
05-11
要在Vue中使用axios下载文件，可以使用以下步骤： 1. 在Vue项目中安装axios： ```bash npm install axios --save ``` 2. 在需要使用axios的Vue文件中引入axios： ```javascript import axios from 'axios' ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值