我的编程空间,编程开发者的网络收藏夹
学习永远不晚

vue下载文件以及文件重命名方式

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

vue下载文件以及文件重命名方式

vue下载文件及文件重命名

http Content-type对照表大家自行百度


export function downFile(item, that) {
    // xxx是后台接口, yyy是后台需要的数据
    // {responseType: 'blob'}必须添加,否则下载的文件会出现乱码
    that.$axios.post('xxx', {
        yyy
    },
    {
        responseType: 'blob'
    }).then(res = >{
        if (res.status === '0') {
            let types = ''
            // 判断文件类型,补充type
            if (item.file_type === 'xlsx' || item.file_type === 'xls') {
                types = 'application/vnd.ms-excel'
            } else if (item.file_type === 'png') {
                types = 'application/x-png'
            } else if (item.file_type === 'jpg') {
                types = 'application/x-jpg'
            } else if (item.file_type === 'jpeg') {
                types = 'image/jpeg'
            }
            // res.data是后台返回的二进制数据,type:types为下载的数据类型
            const blob = new Blob([res.data], {
                type: types
            }) const downLoadEle = document.createElement('a') const href = URL.createObjectURL(blob) downLoadEle.href = href
            // ooo为自定义文件名
            downLoadEle.download = 'ooo'document.body.appendChild(downLoadEle) downLoadEle.click() document.body.removeChild(downLoadEle) window.URL.revokeObjectURL(href)
        }
    })
}

页面引用即可

import {downFile} from '.xx/xxx/xxx'
click(item) {
	const that = this
	downFile(item, that)
} 

vue项目如何改名

在对应的文件资源管理器中重命名到你想要更改的名字(比如这里从hello改成vuejs2)

把项目的node_modules文件夹删除(就是删掉你这个文件夹已有的依赖,别慌,过会可以重新下回来)

找到项目中的package.json文件,

然后重新加载一下依赖项,在对应目录的cmd输入npm install

等依赖加载完后,项目就成功重命名了!!

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

vue下载文件以及文件重命名方式

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

vue下载文件以及文件重命名方式

这篇文章主要介绍了vue下载文件以及文件重命名方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

vue下载文件及文件重命名的方法是什么

这篇文章主要介绍“vue下载文件及文件重命名的方法是什么”,在日常操作中,相信很多人在vue下载文件及文件重命名的方法是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”vue下载文件及文件重命名的方法是什么
2023-07-04

vue中怎么下载excel流文件及设置下载文件名

这篇文章给大家分享的是有关vue中怎么下载excel流文件及设置下载文件名的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。概述导出excel需求,当点击下载模板或下载反馈结果,axios发起后端接口请求,返回的数据
2023-06-15

浅谈vue中文件下载的几种方式及方法封装

本文主要介绍了浅谈vue中文件下载的几种方式及方法封装,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
2023-01-13

VUE+ElementUI下载文件的几种方式(小结)

本文主要介绍了VUE+ElementUI下载文件的几种方式(小结),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
2023-01-13

java下载文件文件名乱码解决方法

在进行文件下载的时候出现中文名称乱码,显示不出来:response.setHeader(“Content-Disposition”, “filename=自定义的名称.jpg” )解决办法对中文名称进行编码处理:String fileName="自定义名称.j
java下载文件文件名乱码解决方法
2016-09-26

Linux下如何批量重命名文件

这篇文章给大家分享的是有关Linux下如何批量重命名文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。在 Linux 中,我们对文件进行重命名一般都会使用到 mv 命令,这在对单个文件重命名时非常方便。但是,若我
2023-06-27

vue关于下载文件常用的几种方式

这篇文章主要介绍了vue关于下载文件常用的几种方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

java中文件下载及文件名乱码问题总结

关于java文件下载文件名乱码问题解决方案:(相关学习课程:java视频教程)String fileName = "下载的文件名"; String userAgent = request.getHeader("User-Agent"); //针对IE或者以IE
java中文件下载及文件名乱码问题总结
2021-10-03

js实现文件流式下载文件方法详解及完整代码

这篇文章主要介绍了用js实现读取文件流并下载到本地的方法,也就是我们经常说的使用js下载文件需要的朋友可以参考下
2022-12-10

SpringBoot下载文件的正确方式~

Spring Boot 配合 axios 实现文件下载功能 前言比较一般的解法分析原因 正确解法 前言 最近遇到一个奇怪的需求,前端通过post请求下载压缩文件,同时会传给后端一些数据,用于生成压缩包。此时后端接口就不仅仅是
2023-08-23

Linux重命名文件有几种方法

Linux重命名文件有四种方法,分别是:1、使用命令行重命名文件,可以用来移动文件或者文件夹,同时也可以用来重命名文件;2、使用文件管理器重命名文件,只需要在文件管理器中选中要重命名的文件,然后通过右键单击文件,选择“重命名”选项。接着,在
2023-08-09

CentOS下删除或重命名乱码文件的方法

这篇文章主要讲解了“CentOS下删除或重命名乱码文件的方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CentOS下删除或重命名乱码文件的方法”吧!当文件名为乱码的时候,无法通过键盘输入
2023-06-10

编程热搜

目录