vue element 导出blob后台文件流xlsx文件自动下载（且规避乱码）

通常情况blob后台文件流都是如下图这样让人崩溃的乱码

<el-buttontype="success"@click.stop="handleExport"icon="el-icon-download"
>导出</el-button>

// 导出----------------------------------------
handleExport() {this.loading = true;const data = {// 导出----------------------------------------/*file_name:"推广记录(" +new Date().toLocaleString("zh-Hans-CN", {year: "numeric",month: "2-digit",day: "2-digit",hour12: false,hour: "2-digit",minute: "2-digit",second: "2-digit",}).replace(/\//g, "-") +").xlsx",*/// ----------------------------------------gid: this.searchForm.gid,gname: this.searchForm.gname,type: this.searchForm.type,status: this.searchForm.status,num: this.searchForm.num,hy: this.searchForm.hy,remark: this.searchForm.remark,};this.$axios.post("https://xxx.com/getlist?export_flag=1",data,{ responseType: "blob" }).then((d) => {if (!d.data) return (this.loading = false,this.$message.error(d.msg)); //导出失败报错！// 自动下载blob文件流xls文件----------------------------------------const blob = new Blob([d.data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8",});//防止下载的文件乱码const url = window.URL.createObjectURL(blob);const link = document.createElement("a");link.style.display = "none";link.href = url;link.setAttribute("download",`导出文件(${new Date().toLocaleString("zh-Hans-CN", {year: "numeric",month: "2-digit",day: "2-digit",hour12: false,hour: "2-digit",minute: "2-digit",second: "2-digit",}).replace(/\//g, "-").replace(/\:/g, "")}).xlsx`//后缀名一定要用xlsx，否则会乱码); //设置下载文件名document.body.appendChild(link);link.click();document.body.removeChild(link); // 下载完成移除元素window.URL.revokeObjectURL(url); // 释放掉blob对象//----------------------------------------this.$message.success("导出xlsx成功");this.loading = false;});
},
// ----------------------------------------

vue element 导出blob后台文件流xlsx文件自动下载（且规避乱码）相关推荐

axios get请求下载后端文件流xlsx文件
const res = await axios({method: 'get',url: `/exportData`,params: {id: this.id,},responseType: 'blob ...
ant 接口返回文件流，前端自动下载实现
封装网络请求 : reqAxios.js import Axios from 'axios'; import qs from 'qs'; import { router } from 'umi'; i ...
php接收流文件,PHP传输文件流及文件流的保存
什么是文件流在HTTP数据传送过程中,传输一方直接以二进制流方式传送文件内容,这样就形成了一个文件流: 文件流的接收通常涉及到预定义变量函数 $HTTP_RAW_POST_DATA 和 file_g ...
Java IO流之【缓冲流和文件流复制文件对比】
与文件流相比,缓冲流复制文件更快代码: package Homework;import java.io.BufferedOutputStream; import java.io.File; impo ...
c# 文件流读写文件
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.I ...
用户态与内核态文件流与文件描述符简介【转】
转自:https://www.cnblogs.com/Jimmy1988/p/7479856.html 用户态和内核态程序代码的依赖和调用关系如下图所示: Lib:标准ASCI C函数,几乎所有的平 ...
python csv文件和xlsx文件混杂时，提取指定列数据并合并
这篇文章是R语言如何合并csv文件(批量读取csv文件)的姊妹篇.提供更为强大的功能. 解决的问题是提取csv文件和xlsx文件混杂时,文件合并问题.具体来说,下面的代码是提取指定列文本,简单清洗后 ...
Java File文件流读取文件夹内的文件并替换文件内容
Java File文件流读取文件夹内的文件并替换文件内容一.前言二.代码三.运行结果一.前言批量读取文件夹内的文件,并替换各个文件的内容二.代码新建一个普通 Java 项目就可以,创建文 ...
python解析dat文件生成xlsx文件
系列文章目录提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加 python解析dat文件生成xlsx文件提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录 ...

vue element 导出blob后台文件流xlsx文件自动下载（且规避乱码）

vue element 导出blob后台文件流xlsx文件自动下载（且规避乱码）相关推荐

最新文章

热门文章