将数据保存到excel文件(纯前端实现)
// 导出excel文件
/**
* 依赖: import XLSX from 'xlsx'
*/
let obj = {
'学生信息表': [
['姓名', '性别', '年龄', '分数'],
['张三', '男', 18, parseInt(Math.random() * 100)],
['李四', '女', 22, parseInt(Math.random() * 100)]
],
'教师信息表': [
['姓名', '性别', '年龄', '教龄'],
['王五', '男', 18, parseInt(Math.random() * 10), new Date()],
['牛六', '女', 22, parseInt(Math.random() * 10)]
]
}
let arr = [
['姓名', '性别', '年龄', '教龄'],
['王五', '男', 18, parseInt(Math.random() * 10)],
['牛六', '女', 22, parseInt(Math.random() * 10)]
]
this.downloadXlsx(obj, 'result', '信息表')
downloadXlsx (data, fileName, sheetName) {
fileName = (fileName || 'fileName') + '.xlsx'
sheetName = sheetName || 'sheet1'
download(data2blob(data, sheetName), fileName)
this.readWorkbookFromLocalFile(sheet2blob(data, sheetName), res => {
console.log(res)
})
// 下载excel文件
function download (url, fileName) {
if (typeof url == 'object' && url instanceof Blob) {
url = URL.createObjectURL(url) // 创建blob地址
}
let element = document.createElement('a')
element.href = url
element.download = fileName // HTML5新增的属性,指定保存文件名,可以不要后缀,注意,file:///模式下不会生效
element.style.display = 'none'
element.click()
}
// 利用xlsx提供的方法将对象转成blob
function data2blob (data, sheetName) {
let workbook = {
SheetNames: [],
Sheets: {}
}
if (data instanceof Array) {
workbook.SheetNames = [sheetName]
workbook.Sheets[sheetName] = XLSX.utils.aoa_to_sheet(data)
} else if (data instanceof Object) {
for (const key in data) {
if (data.hasOwnProperty(key)) {
const arr = data[key]
if (arr instanceof Array) {
workbook.SheetNames.push(key)
workbook.Sheets[key] = XLSX.utils.aoa_to_sheet(arr)
} else throw new Error('数据格式不正确')
}
}
}
// 生成excel的配置项
let wopts = {
bookType: 'xlsx', // 要生成的文件类型
bookSST: false, // 是否生成Shared String Table,官方解释是,如果开启生成速度会下降,但在低版本IOS设备上有更好的兼容性
type: 'binary'
}
let wbout = XLSX.write(workbook, wopts)
let blob = new Blob([s2ab(wbout)], { type: "application/octet-stream" })
// 字符串转ArrayBuffer
function s2ab (s) {
let buf = new ArrayBuffer(s.length)
let view = new Uint8Array(buf)
for (let i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF
return buf
}
return blob
}
}
将数据保存到excel文件(纯前端实现)的更多相关文章
- Sql数据保存到Excel文件中
public string ExportExcel( DataSet ds,string saveFileName) { try { if (ds == null) return "数据库为 ...
- 利用PHPExcel实现数据保存到excel文件
include(dirname(__FILE__) .'/phpexcel-1.7.7/Classes/PHPExcel.php'); include(dirname(__FILE__) .'/php ...
- c# 将datatable中的数据保存到excel文件中
using System; using System.Collections.Generic; using System.Data; using System.IO; using System.Lin ...
- 关于爬取数据保存到json文件,中文是unicode解决方式
流程: 爬取的数据处理为列表,包含字典.里面包含中文, 经过json.dumps,保存到json文件中, 发现里面的中文显示未\ue768这样子 查阅资料发现,json.dumps 有一个参数.ens ...
- 使用scrapy爬取的数据保存到CSV文件中,不使用命令
pipelines.py文件中 import codecs import csv # 保存到CSV文件中 class CsvPipeline(object): def __init__(self): ...
- python爬取数据保存到Excel中
# -*- conding:utf-8 -*- # 1.两页的内容 # 2.抓取每页title和URL # 3.根据title创建文件,发送URL请求,提取数据 import requests fro ...
- ruby将mysql查询到的数据保存到excel
require "win32ole" require 'pathname' require 'mysql2' excel = WIN32OLE.new('excel.applica ...
- 保存到Excel文件中
OLEObject ole_object , ole_workbooks ole_object = CREATE OLEObjectIF ole_object.ConnectToNewObject(& ...
- jmeter 非GUI执行测试,没有响应数据保存到jtl文件办法
估计是jmeter为了减轻客户机负担,就没又默认把这些信息保存,如果想要保存,也可以,需要做出如下配置: 修改bin目录下的user.properties文件,追加配置: jmeter.save.sa ...
随机推荐
- Volitle
缓存一致性协议 最出名的是Intel的MESI协议,该协议保证了每个缓存中使用的共享变量的副本是一致的.其思想是:当CPU写数据时,如果发现操作的变量是共享变量,即在其他CPU中也存在该变量的副本,会 ...
- vue使用GraphVis开发无限拓展的关系图谱
1.去GraphVis官网下载对应的js,新版和旧版的js有所不同,看自己需求引入旧版还是新版(GraphVis官方网址:http://www.graphvis.cn/) visgraph.min.j ...
- 比@EnableMongoAuditing功能强大的实现
问题出现 以前通过@EnableMongoAuditing.@CreateDate.@LastModifiedDate进行实体类创建时间.修改时间的自动管理. 但为了实现多数据源的管理以及切换,自己覆 ...
- 学习笔记-CCS-MSP430F5529[快速入门篇二]
由于2021的全国电赛延期了,从今天开始打算好好整理一下使用CCS编程的经验,本篇笔记会好好整理一下我备赛期间用CCS写的程序,包括外部中断,定时器部分的定时中断,定时器输入捕获,PWM波输出,UAR ...
- Mybatis学习笔记-复杂查询
多个学生,对应一个老师 对于学生而言,关联:多个学生关联一个老师[多对一] 对于老师而言,集合:一个老师,有多个学生[一对多] 复杂查询环境搭建 数据库搭建 CREATE TABLE `teacher ...
- linux中的dhcp
目录 一.DHCP服务 二.DHCP的租约过程 三.使用DHCP动态配置主机地址 四.安装DHCP服务器 一.DHCP服务 ① DHCP (Dynamic HostConfiguration Prot ...
- 《手把手教你》系列技巧篇(十七)-java+ selenium自动化测试-元素定位大法之By css上卷(详细教程)
1.简介 CSS定位方式和xpath定位方式基本相同,只是CSS定位表达式有其自己的格式.CSS定位方式拥有比xpath定位速度快,且比CSS稳定的特性.下面详细介绍CSS定位方式的使用方法.xpat ...
- 用Matlab求解微分方程
用Matlab求解微分方程 解微分方程有两种解,一种是解析解,一种是数值解,这两种分别对应不同的解法 解析解 利用dsolve函数进行求解 syms x; s = dsolve('eq1,eq2,.. ...
- STP生成树的一些笔记
一.STP概述 1.1.STP简介 交换网络环路主要由广播风暴.多帧复制和MAC地址表紊乱造成. 广播风暴:一个数据帧或包被传输到本地网段 (由广播域定义)上的每个节点就是广播:由于网络拓扑的设计和连 ...
- JavaSE-常用类
JavaSE-常用类 Obeject Java Object类是所有类的父类,也就是说Java的所有类都继承了Object,子类可以使用Object的所有方法. Object类位于java.lang包 ...