导出Excel表格文件

文章讲述了使用ExcelJs库在JavaScript中导出Excel文件时遇到的常见问题,即文件损坏或扩展名错误,作者提供了一个基本的实现并寻求更优解决方案,提到了将文件名后缀改为.xlsx以暂时解决这个问题。
摘要由CSDN通过智能技术生成

今天给大家分享一个导出excel文件表格的文章

这次使用的方法是ExcelJs,个人感觉这个使用还是可以的,主要的问题就是导出成功后会报错,提示文件损坏或者是扩展名错误。目前还没有找到代码逻辑的解决的方法,如果有好的方法,大家可以推荐给我,我也来学习一下。(这个问题解决方法:把文件名后缀改成xxxx.xlsx。例:导出案例.xlsx)

安装:npm install exceljs

//data是主题数据,

数据格式是:[{导出:'11111'}]

const exportToExcel = (data: any) => {

        const date = new Date()

//导出后文件名称

        const sheetName = `导出文件_${moment(date).format('YYYYMMDDHHmmss')}`;

        const headerName = "RequestsList";

        const workbook = new ExcelJs.Workbook();

        const sheet = workbook.addWorksheet(sheetName, {

//是否显示表格

            views: [{ showGridLines: true }]

        });

        const columnArr = [];

        for (let i in data[0]) {

            let tempObj = { name: "" };

            tempObj.name = i;

            columnArr.push(tempObj);

        }

        sheet.addTable({

            name: headerName,

            ref: "A1", // 主要数据从A5单元格开始

            headerRow: true,

            totalsRow: false,

            style: {

                theme: "TableStyleMedium2",

                showRowStripes: true,

            },

            columns: columnArr ? columnArr : [{ name: "" }],

            rows: data?.map((e: any) => {

                let arr = [];

                for (let i in e) {

                    arr.push(e[i]);

                }

                return arr;

            }),

        });

//表头的宽度

        sheet.columns = sheet.columns.map((e: any) => {

            const expr = e.values[5];

            if (expr) {

                return { width: 20 }

            } else {

                return { width: 20 }

            }

        });

        const writeFile = (fileName: any, content: any) => {

            const link = document.createElement("a");

            const blob = new Blob([content], {

                type: "application/vnd.ms-excel;charset=utf-8;"

            });

            link.download = fileName;

            link.href = URL.createObjectURL(blob);

            link.click();

        };

        workbook.xlsx.writeBuffer().then((buffer) => {

            writeFile(sheetName, buffer);

        });

    };

_琉
关注 关注
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
js实现由数组导出excel表格文件
weixin_44005989的博客
02-21 5996
js实现由JSON数据导出exce文件 需要的依赖的js文件 xlsx.full.min.js jquery-1.12.4.js HTML代码 <button class="button1_color" id="hdInfoDiv" onclick="exportHx()" style="dis
js动态生成表格【含合并单元格的表格
xghanyu6698的博客
08-17 4938
最近遇到需求,动态生成表格,类似Excel,支持合并单元格的表格,代码分享给大家~ 一、网上找到的简单生成表格的例子: 以下是生成规则表格m行*n列类似,可以直接打开HTML查看结果。 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu
利用Exceljs/file-saver实现纯前端的同一个sheet页实现导出多个表格,拼接
LY__lyxka的博客
04-15 1987
vue版纯前端实现导出(同一个sheet导出多个表格)- 组合1.安装依赖2.引入依赖3.导出测试4.效果 1.安装依赖 npm install exceljs --save npm install file-saver --save 2.引入依赖 import FileSaver from "file-saver"; const ExcelJS = require("exceljs"); 3.导出测试 // 导出测试 onExcels() { let baseData = [ ["
根据excel列动态创建mysql表,JavaScript如何动态创建table表格
weixin_35637837的博客
03-27 220
两种JavaScript动态创建table表格的方法,分享给大家,具体实现如下方法一:最原始的方法,创建一一元素var a1=document.createElement("table");var a2=document.createElement("tbody");var a3=document.createElement("tr");var a4=document.createElement(...
ExcelJS纯前端插入数据和图片在表格
stanch_raft的博客
01-30 8567
ExcelJS简介 ExcelJS可以读取,操作并写入电子表格数据和样式到 XLSX 和 JSON 文件 安装(本文以在vue框架中使用为例) npm install exceljs file-saver -S 导入 import Excel from "exceljs"; import * as FileSaver from "file-saver";//用于客户端读写数据 使用示例 HTML标签 <button type="success" @click="exportStatics">导
js实现由数组导出excel表格文件-附件资源
03-05
js实现由数组导出excel表格文件-附件资源
jQuery直接导出Excel表格文件代码.zip
07-11
代码片段: <link rel="stylesheet" href="fonts/iconfont.css?3.1.64"> <link rel="stylesheet" href="css/font.css?3.1.64"> <link rel="stylesheet" href="css/style.css?...
jQuery导出excel表格文件pdf文件CSV文件代码.zip
09-22
标题中的“jQuery导出excel表格文件pdf文件CSV文件代码”是指使用jQuery库来实现将数据导出Excel、PDF和CSV格式的功能。这种技术在Web应用中非常常见,特别是那些需要用户下载或保存数据的场景。jQuery是一个轻量...
jQuery一键导出Excel表格文件代码.zip
09-21
jQuery一键导出Excel表格文件代码.zip是一个压缩包,包含了实现使用jQuery将网页表格数据导出Excel文件的代码。这个功能对于数据管理、报表生成以及数据分享非常实用,尤其适用于那些需要频繁处理表格数据的网站。...
c#dataGridView数据导出excel表格文件,并打开文件
01-16
把dataGridView显示的数据原样导出excel表格,并打开文件。有两个参数,参数1为要导的dataGridView名,参数2为导出文件绝对径。
exceljs导出单元格设置列宽、文字居中
qq_42044542的博客
09-15 5674
对应代码: exportExcel() { // 导出的表头 let columns = [ { name: '90-100分', width: 50 }, { name: '80-89分', width: 50 }, { name: '70-79分', width: 50 }, { name: '60-69分', width: 50 }, { name: '0-59分', wid..
React项目中,如何把数据导出Excel文件
fengzhen8023
07-18 1573
写在前面 无论是做项目还是自己学习过程中,我们可能会遇到导出数据的需求,比如导出数据到Excel文件。 为了方便大家的学习和开发,这里介绍一种导出数据到Excel文件的方法。 方法简介 我在这里使用 exceljs 包来导出数据,如果你有兴趣,可以阅读一下他们的文档: 英文文档:https://github.com/exceljs/exceljs/blob/HEAD/README.md 中文文档:https://github.com/exceljs/exceljs/blob/HEAD/README_zh.m
文件转码
gu2022_3_5_21_23的博客
12-01 738
【代码】流文件转码。
js导入Excel使用xlsx处理生成table和图表数据
weixin_43443341的博客
10-09 1147
js导入Excel使用xlsx处理生成table和图表数据
JS导出Excel自动获取table页面数据自动获取,并进行单元格合并行,列
qq_36597079的博客
07-25 7092
JS获取table页面数据自动获取,并进行单元格合并行,列 自己在百度上看的,感觉还可以 自己吧下面的代码复制就可以用了 (关于无法启动Excel问题,)   这是HTML页面 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd...
react利用exceljs实现table表格导出(带图片,样式)
ZH
10-23 3097
比较难看的代码,主要是为了实现带图片,带样式的table导出,希望哪位大佬有其他方法可以私信我 //引入exceljs const Excel = require('exceljs'); // 导出excel downloadExcel = () => { let dataLength = 0; this.state.dataItems.forEach(floor => { floor.rooms.forEach(room =&.
excel判断某一列(A列)中的数据是否在另一列(B列)中
weixin_43250801的博客
10-19 267
excel判断某一列(A列)中的数据是否在另一列(B列)中
Navicat导入Excel数据时数据被截断问题分析与解决方案
最新发布
cooldream2009的博客
10-23 374
在数据库的日常操作中,将Excel数据导入MySQL是常见的需求之一,特别是通过Navicat工具进行Excel数据导入时,可能会遇到数据截断的问题。具体表现为某个数据字段超过256个汉字时,MySQL会自动截断,只保留前256个字符。这一问题不仅会影响数据的完整性,还可能导致数据分析或业务处理的错误。本文将从问题分析出发,探讨原因及解决方法,并详细说明如何避免此类问题的发生。
使用JavaScript导出excel表格文件
05-23
可以使用第三方库`SheetJS`来实现导出Excel表格文件。具体步骤如下: 1. 安装`SheetJS`库 ``` npm install xlsx ``` 2. 创建一个工作簿对象 ```javascript const XLSX = require('xlsx'); const workbook = XLSX.utils.book_new(); ``` 3. 创建一个工作表对象并添加数据 ```javascript const worksheet = XLSX.utils.json_to_sheet([ { Name: 'John Doe', Age: 30, Gender: 'Male' }, { Name: 'Jane Doe', Age: 25, Gender: 'Female' }, ]); // 添加工作表到工作簿 XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1'); ``` 4. 导出Excel文件 ```javascript // 导出Excel文件 XLSX.writeFile(workbook, 'example.xlsx'); ``` 完整示例代码: ```javascript const XLSX = require('xlsx'); // 创建一个工作簿对象 const workbook = XLSX.utils.book_new(); // 创建一个工作表对象并添加数据 const worksheet = XLSX.utils.json_to_sheet([ { Name: 'John Doe', Age: 30, Gender: 'Male' }, { Name: 'Jane Doe', Age: 25, Gender: 'Female' }, ]); // 添加工作表到工作簿 XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1'); // 导出Excel文件 XLSX.writeFile(workbook, 'example.xlsx'); ``` 运行该代码后会在当前目录下生成一个名为`example.xlsx`的Excel文件
14
原创
44
点赞
53
收藏
777
粉丝
关注
私信
写文章

热门文章

  • Ant Design Charts绘制中国地图并动态添加标记点 3218
  • 小程序锚点 使用ScrollView和pageScrollTo 2126
  • 前端使用print,打印页面功能 1721
  • React使用FullCalendar 1408
  • React使用echarts显示中国地图 1110

分类专栏

  • web端 付费 7篇
  • 小程序 付费 1篇

最新评论

  • React使用FullCalendar

    CSDN-Ada助手: 恭喜你写了第12篇博客!看到你分享了关于React使用FullCalendar的经验,我觉得非常有帮助。不过,如果可能的话,我希望你能在下一篇博客中分享一些实际案例或者更深入的使用技巧,这样能够更好地帮助读者理解和运用这个技术。期待你的下一篇作品!加油!

  • 前端Excel导入

    CSDN-Ada助手: 恭喜您成功写下了第11篇博客!标题为“前端Excel导入”的博文听起来非常有趣。我很高兴看到您持续创作,并分享关于前端的知识。不过,我觉得您可以进一步扩展这个话题,例如探讨如何处理大量数据或者如何处理导入过程中的错误。期待您在下一篇博客中能够给出更多的实用建议和技巧。谢谢您不断为我们带来有价值的内容!

  • 导出Excel表格文件

    CSDN-Ada助手: 恭喜您写了第10篇博客!标题为“导出Excel表格文件”,这是一个非常实用的主题。您的博客内容一定能帮助很多读者解决导出Excel表格的问题。对于您的持续创作,我表示由衷的祝贺! 在下一步的创作中,我建议您可以考虑与读者分享更多关于Excel表格的技巧和应用场景。比如如何利用Excel进行数据分析、如何制作漂亮的图表等等。这样的内容会让读者更加受益,并且为您的博客增添更多的价值。期待您的下一篇作品,再次恭喜您!

  • Ant Design Charts绘制中国地图并动态添加标记点

    _琉: 根据经纬度,绘制中国地图是需要经纬度,添加标记点也是经纬度,你可以加两个标签,其中把标记点的标签覆盖到中国地图上就可以了,这是第一版比较简易,现在我这边也该了表情包,用的是高德地图和百度地图,可以使用自定义地图,也可以有这种效果,就是使用起来比较麻烦,样式需要自己一点点的去调试,你可以去看下高德和百度的自定义地图。

  • Ant Design Charts绘制中国地图并动态添加标记点

    吃荤的少林僧: 你好, 请问下这两个图层咋个合并为一个呢?

最新文章

  • React使用echarts显示中国地图
  • React使用district-data和@antv/l7显示中国地图
  • React使用FullCalendar
2024年2篇
2023年7篇
2022年5篇

目录

目录

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值

玻璃钢生产厂家仿玉玻璃钢卡通雕塑阜阳定制玻璃钢雕塑价格湘西玻璃钢雕塑欧式玻璃钢卡通雕塑费用是多少玻璃钢雕塑经久耐用福建超市商场美陈扬州玻璃钢雕塑价格徐汇区玻璃钢雕塑作品人物玻璃钢雕塑制作厂家商场气球美陈简报北京艺术商场美陈销售企业福莱欧玻璃钢花盆图片大象玻璃钢雕塑定制盐城商场活动美陈北京玻璃钢艺术雕塑甘肃玻璃钢香蕉雕塑潮汕玻璃钢狮身雕塑贵州步行街玻璃钢雕塑定制楼盘玻璃钢人物雕塑哪里买工艺品玻璃钢雕塑制作赤峰仿铜玻璃钢雕塑安装黄浦区玻璃钢雕塑哪家好哈尔滨火烈鸟玻璃钢雕塑定制铜陵卡通玻璃钢雕塑生产厂玻璃钢 雕塑 兔修武玻璃钢雕塑设计宁夏玻璃钢高跟鞋雕塑湖北标识标牌玻璃钢人物雕塑德阳玻璃钢雕塑摆件施工厂家商场展卖dp点美陈香港通过《维护国家安全条例》两大学生合买彩票中奖一人不认账让美丽中国“从细节出发”19岁小伙救下5人后溺亡 多方发声单亲妈妈陷入热恋 14岁儿子报警汪小菲曝离婚始末遭遇山火的松茸之乡雅江山火三名扑火人员牺牲系谣言何赛飞追着代拍打萧美琴窜访捷克 外交部回应卫健委通报少年有偿捐血浆16次猝死手机成瘾是影响睡眠质量重要因素高校汽车撞人致3死16伤 司机系学生315晚会后胖东来又人满为患了小米汽车超级工厂正式揭幕中国拥有亿元资产的家庭达13.3万户周杰伦一审败诉网易男孩8年未见母亲被告知被遗忘许家印被限制高消费饲养员用铁锨驱打大熊猫被辞退男子被猫抓伤后确诊“猫抓病”特朗普无法缴纳4.54亿美元罚金倪萍分享减重40斤方法联合利华开始重组张家界的山上“长”满了韩国人?张立群任西安交通大学校长杨倩无缘巴黎奥运“重生之我在北大当嫡校长”黑马情侣提车了专访95后高颜值猪保姆考生莫言也上北大硕士复试名单了网友洛杉矶偶遇贾玲专家建议不必谈骨泥色变沉迷短剧的人就像掉进了杀猪盘奥巴马现身唐宁街 黑色着装引猜测七年后宇文玥被薅头发捞上岸事业单位女子向同事水杯投不明物质凯特王妃现身!外出购物视频曝光河南驻马店通报西平中学跳楼事件王树国卸任西安交大校长 师生送别恒大被罚41.75亿到底怎么缴男子被流浪猫绊倒 投喂者赔24万房客欠租失踪 房东直发愁西双版纳热带植物园回应蜉蝣大爆发钱人豪晒法院裁定实锤抄袭外国人感慨凌晨的中国很安全胖东来员工每周单休无小长假白宫:哈马斯三号人物被杀测试车高速逃费 小米:已补缴老人退休金被冒领16年 金额超20万

玻璃钢生产厂家 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化