表格导出Excle文件

表格数据导出成Excle文件

1.封装请求 exportExcle.js

import axios from 'axios';
export const exportExcle = (data) => {return axios({url: 'export/excle', // 后端接口地址method: 'post',headers: { 'content-type': 'application/json' },data,responseType: "blob"})
}

<template><div class="container"><!-- 记得对比导出按钮做防抖操作 --><el-button type="primary"  @click="exportExcle">导出</el-button><el-table >..............</el-table></div>
</template><script>
// 从 exportExcle.js 中导入 exportExcle 请求方法
import { exportExcle } from '@src/utils/exportExcle.js'
export default {methods: {exportExcle () {let fileName = '导出文件的文件名'try {let obj = { 调用后端接口的参数 ... }// exportExcle 调用后端接口查询符合条件的数据exportExcle(obj).then(res => {/* res.data 为如下对象{size: '6960',type: 'application/vnd.ms-excel',[[prototype]]: {arrayBuffer: function(){},size: 6960,slice: function(){},stream: function(){},text: function(){},type: 'application/vnd.ms-excel',}}*/this.tableDataExportExcle(res.data, fileName)})} catch (error) {}},// table数据导出成excle文件tableDataExportExcle(data, fileName) {const blob = new Blob([data], { type: "application/vnd.ms-excel" });const elink = document.createElement("a");elink.download = `${fileName}-${Date.now()}`; // 确保导出的名字是唯一的elink.style.display = "none";elink.href = URL.createObjectURL(blob);document.body.appendChild(elink);elink.click();URL.revokeObjectURL(elink.href);document.body.removeChild(elink);}}
}
</script>

表格导出Excle文件相关推荐

jQuery表格导出Excel文件以及网页内容导出Word文档
前言: 我在这里给大家介绍一下我们能用代码实现的最简单的两种转换为Excel文件以及Word文档的方法. jQuery表格导出Excel文件先来看看我们的层级划分: 如图所示: demo.css 代 ...
金算盘导出oracle,金算盘导出excle_金蝶财务软件的报表如何导出excle文件?
金算盘财务软件的数据如何才能能导出到EXCEL 金算盘财务软件据导出到EXCEL两种: 第一种情况,如果算盘电子表格生成的资产负债表的话,点文件--另存为,然后选择保存类型为excel就可以了. 第二 ...
java导出 elsx 文件,如何获取java导出的excel文件,发送请求导出excle文件
如何获取java导出的excel文件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 request.setCharacterEncoding("utf-8"); ...
laravel8 导出Excle文件
1.参考Excle官方网址. Laravel |中的 Superged Excel 导出和导入Laravel Excel (laravel-excel.com)https://laravel-exce ...
Vue前端表格导出Excel文件
前言分享一个Vue前端导出Excel文件的方法.记录学习! 功能需求:将表格的全部数据导出Excel格式的文件前端:Vue3+Element-Plus 这个导出方法全部为前端操作,后端只需要传入表 ...
java 导出excle文件打不开，提示文件已损坏解决办法
问题描述: 通过浏览器下载的excle文件 office打不开,提示文件已损坏! 通过postman 下载没问题! 以下是测试代码,写法肯定没问题.在网上看很多文章,依然没解决问题.估计一次踩坑笔记. ...
基于Element Plus 表格导入和导出excle文件
首先,安装依赖 npm install --save xlsx file-saver //也可以使用cnpm安装查看package.json是否安装成功,以下代表安装成功 "file-sa ...
java库存导出_java生成导出excle文件
public void getExportExcle(List< Object > list,HttpServletResponse response) throws Unsupporte ...
把table表格导出为excel文件
<script type="text/javascript">/* 把html table表格导出为excle文件使用方法:<a href="javaS ...

表格导出Excle文件

表格数据导出成Excle文件

1.封装请求 exportExcle.js

表格导出Excle文件相关推荐

最新文章

热门文章