域名和网站空间相互做解析,软件开发哪家公司好,东莞常平邮编,昆山建设监察网站json数据转excel
有时候我们会遇到这样一个需求#xff0c;就是将数据转成excel下载#xff0c;这一般都是由后端来处理#xff0c;使用插件poi轻松搞定。如果只有少量数据#xff0c;那么能不能避免调用后端接口#xff0c;前端直接处理呢#xff1f;
答案是#xff…json数据转excel
有时候我们会遇到这样一个需求就是将数据转成excel下载这一般都是由后端来处理使用插件poi轻松搞定。如果只有少量数据那么能不能避免调用后端接口前端直接处理呢
答案是当然可以
使用exceljs excel专用插件来实现前端json数据转成excel文件并进行下载。
直接看效果json格式化
一、下载安装
yarn add exceljs; 版本可以安装最新版不过推荐下面版本不会出现问题
dependencies: {exceljs: ^4.3.0,},
二、使用
1、引入插件
import ExcelJS from exceljs;//直接使用
完事之后接下来就是具体应用了
三、将json数据写入excel并导出excel
直接看代码-
exportExcel() {const workbook new ExcelJS.Workbook();const worksheet workbook.addWorksheet(Sheet1);//创建工作簿和工作sheetlet json this.getJSON();//这里是从方法中取到json换成自己的数据即可if (Array.isArray(json)) {//判断json是否是数组如果是数组则进行遍历let title [];for (let key in json[0]) {title.push(key);}worksheet.addRow(title);json.forEach((item, index) {let v [];for (let key in item) {v.push(item[key]);}worksheet.addRow(v);});} else {//非数组直接填入工作sheetlet title [];for (let key in json) {title.push(key);}worksheet.addRow(title);let v [];for (let key in json) {v.push(json[key]);}worksheet.addRow(v);}//开始导出主要type类型要设置为excel对应的格式workbook.xlsx.writeBuffer().then((buffer) {const blob new Blob([buffer], {type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,});const url URL.createObjectURL(blob);const link document.createElement(a);link.href url;link.download data.xlsx; // 下载文件名link.click();});},
