热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

Springbootvue导出功能实现代码

这篇文章主要介绍了Springbootvue导出功能实现代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

最近在工作遇到vue和Springboot 实现导出功能,翻看很多资料,发现一些博客写法都过时了,所以自己特此记录下,使用版本vue2,Springboot 2x以上,chrome浏览器 76.0.3809.100

vue 2写法

let blob = new Blob([res.data], { type: 'application/octer-stream' });

其中我发现很多博客用这样的写法,但是我发现打印res的时候没有发现data这个参数,总是报错后面直接用res就好了。
正确写法let blob = new Blob([res], { type: 'application/octer-stream' });

科普一下:axios中params和data两者,以为他们是相同的,实则不然。 因为params是添加到url的请求字符串中的,而data是添加到请求体(body)中的,最好使用params参数

import axios from 'axios'
axios({
	method: 'post',
	 url: '/user/excelExport',
	 responseType:‘blob',
	 params
}
).then(res => {
const link = document.createElement('a')
let blob = new Blob([res], { type: 'application/octer-stream' });
link.style.display = 'none'
link.href = URL.createObjectURL(blob);
link.setAttribute('download', fileName + '.xlsx');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
).catch(err => {
console.log(err)
}
);

后台代码写法 ——使用阿里巴巴的excel导出类easyexcel  https://github.com/alibaba/easyexcel


com.alibaba
easyexcel
{latestVersion}
//这里可以不用关闭流,流在方法结束,会自动关闭,通过配置product,指定返回头
   @PostMapping(path = "/user/excelExport", produces = MediaType.APPLICATION_OCTET_STREAM_VALUE)
   public void excelExport(WithdrawListDto withdrawListDto, HttpServletResponse response) {
       List list = withdrawService.list(withdrawListDto);
       ExcelWriter writer = new ExcelWriter(response.getOutputStream(), ExcelTypeEnum.XLSX, true);
       Sheet sheet1 = new Sheet(1, 0, WithdrawListVo.class);
       sheet1.setSheetName("sheet1");
       writer.write(list, sheet1);
   }

PostMapping,加上返回头了。前端传过来的context-Type 要加上multipart/form-data 类型,然后在前端传过来的url进行拼接参数,就可以进行多参数,但是不建议参数太多

例子:如/user/excelImport?account=12731564&userName=李四

@PostMapping(path = "/user/excelImport")
   public void excelImport(WithdrawListDto withdrawListDto,MultipartFile multipartFile) {
   }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • 深入浅出TensorFlow数据读写机制
    本文详细介绍TensorFlow中的数据读写操作,包括TFRecord文件的创建与读取,以及数据集(dataset)的相关概念和使用方法。 ... [详细]
  • 本文将带您了解Cocos家族的不同版本和分支,特别是Cocos Creator的发展历程及其核心特性,帮助初学者快速入门。 ... [详细]
  • 深入解析:OpenShift Origin环境下的Kubernetes Spark Operator
    本文探讨了如何在OpenShift Origin平台上利用Kubernetes Spark Operator来管理和部署Apache Spark集群与应用。作为Radanalytics.io项目的一部分,这一开源工具为大数据处理提供了强大的支持。 ... [详细]
  • 本文探讨了2019年前端技术的发展趋势,包括工具化、配置化和泛前端化等方面,并提供了详细的学习路线和职业规划建议。 ... [详细]
  • Spring Cloud学习指南:深入理解微服务架构
    本文介绍了微服务架构的基本概念及其在Spring Cloud中的实现。讨论了微服务架构的主要优势,如简化开发和维护、快速启动、灵活的技术栈选择以及按需扩展的能力。同时,也探讨了微服务架构面临的挑战,包括较高的运维要求、分布式系统的复杂性、接口调整的成本等问题。最后,文章提出了实施微服务时应遵循的设计原则。 ... [详细]
  • Win10 UWP 开发技巧:利用 XamlTreeDump 获取 XAML 元素树
    本文介绍如何在 Win10 UWP 开发中使用 XamlTreeDump 库来获取和转换 XAML 元素树为 JSON 字符串,这对于 UI 单元测试非常有用。 ... [详细]
  • 1、字符型常量字符型常量指单个字符,是用一对单引号及其所括起来的字符表示。例如:‘A’、‘a’、‘0’、’$‘等都是字符型常量。C语言的字符使用的就是 ... [详细]
  • Spring Cloud Config 使用 Vault 作为配置存储
    本文探讨了如何在Spring Cloud Config中集成HashiCorp Vault作为配置存储解决方案,基于Spring Cloud Hoxton.RELEASE及Spring Boot 2.2.1.RELEASE版本。文章还提供了详细的配置示例和实践建议。 ... [详细]
  • matlab gamma函数_MATLAB做晶体结构图(固体物理)
    写在前面最近在复习考研复试《固体物理》这一门课,去年学的内容已经忘干净了,所以就翻开前几页。突然看到了面心立方和体心立方结构图,想到了去年 ... [详细]
  • OBS (Open Broadcaster Software) 架构解析
    本文介绍 OBS(Open Broadcaster Software),一款专为直播设计的开源软件。文章将详细探讨其技术架构、核心组件及其开发环境要求。 ... [详细]
  • LCUI 2.1.0 版本现已推出,这是一个用 C 语言编写的图形用户界面开发库,适合创建轻量级的桌面应用程序。此次更新包括多项修复和功能增强,并正式宣布将启动 Android 支持的开发计划。 ... [详细]
  • 本文将指导您如何在Docker环境中高效地搜索、下载Redis镜像,并通过指定或不指定配置文件的方式启动Redis容器。同时,还将介绍如何使用redis-cli工具连接到您的Redis实例。 ... [详细]
  • 本改进旨在提升运行选择器中名称换行的显示效果,以提高用户体验。 ... [详细]
  • 本文详细介绍了如何通过Git Bash在本地仓库与远程仓库之间建立连接并进行同步操作,包括克隆仓库、提交更改和推送更新等步骤。 ... [详细]
  • Windows 环境下安装 Git 并连接 GitHub 的详细步骤
    本文详细介绍了如何在 Windows 系统中安装 Git 工具,并通过配置 SSH 密钥实现与 GitHub 的安全连接。包括下载、安装、环境配置及验证连接等关键步骤。 ... [详细]
author-avatar
阿思翠
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有