XLSX.utils.json_to_sheet导出excel 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 
 4 <head>
 5   <meta charset="UTF-8">
 6   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7   <meta http-equiv="X-UA-Compatible" content="ie=edge">
 8   <title>Document</title>
 9   <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
10 </head>
11 
12 <body>
13   <input type='file' onchange='importDataSource(this)' />
14   <button onclick="json2Excel()">导出</button>
15 </body>
16 
17 </html>
18 
19 
20 <script>
21 
22   var dataSource = null;
23   var fileName = '';
24   //1、importDataSource() 方法用来获取json数据
25   function importDataSource(obj) {
26 
27     //2、obj.files[0]获得onchange文件，name获得文件名作为Excel的文件名
28     fileName = obj.files[0].name.split('.')[0];
29 
30     //3、创建FileReader对象，将文件内容读入内存，通过一些api接口，可以在主线程中访问本地文件
31     var reader = new FileReader();
32 
33     //4、readAsText(file) 异步按字符读取文件内容，结果用字符串形式表示
34     reader.readAsText(obj.files[0]);
35 
36     var that = this
37 
38     //5、onload事件，当读取操作成功完成时调用
39     reader.onload = function () {
40 
41       //读取完毕后输出结果 为字符串 此时需要转成json对象
42       that.dataSource = JSON.parse(this.result);
43       console.log(that.dataSource)
44     }
45   }
46   function json2Excel() {
47     var wopts = {
48       bookType: 'xlsx',
49       bookSST: false,
50       type: 'binary'
51     };
52     var workBook = {
53       SheetNames: ['Sheet1'],
54       Sheets: {},
55       Props: {}
56     };
57     //1、XLSX.utils.json_to_sheet(data) 接收一个对象数组并返回一个基于对象关键字自动生成的“标题”的工作表，默认的列顺序由使用Object.keys的字段的第一次出现确定
58     //2、将数据放入对象workBook的Sheets中等待输出
59     workBook.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(dataSource)
60 
61     //3、XLSX.write() 开始编写Excel表格
62     //4、changeData() 将数据处理成需要输出的格式
63     saveAs(new Blob([changeData(XLSX.write(workBook, wopts))], { type: 'application/octet-stream' }))
64   }
65   function changeData(s) {
66     //如果存在ArrayBuffer对象(es6) 最好采用该对象
67     if (typeof ArrayBuffer !== 'undefined') {
68 
69       //1、创建一个字节长度为s.length的内存区域
70       var buf = new ArrayBuffer(s.length);
71 
72       //2、创建一个指向buf的Unit8视图，开始于字节0，直到缓冲区的末尾
73       var view = new Uint8Array(buf);
74 
75       //3、返回指定位置的字符的Unicode编码
76       for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
77       return buf;
78 
79     } else {
80       var buf = new Array(s.length);
81       for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
82       return buf;
83     }
84   }
85   function saveAs(obj, fileName) {//当然可以自定义简单的下载文件实现方式
86     var tmpa = document.createElement("a");
87     tmpa.download = fileName ? fileName + '.xlsx' : new Date().getTime() + '.xlsx';
88     tmpa.href = URL.createObjectURL(obj); //绑定a标签
89     tmpa.click(); //模拟点击实现下载
90 
91     setTimeout(function () { //延时释放
92       URL.revokeObjectURL(obj); //用URL.revokeObjectURL()来释放这个object URL
93     }, 100);
94 
95   }
96 </script>

文章抄自https://segmentfault.com/a/1190000014242385?utm_source=tag-newest，仅供个人学习笔记留存！

posted @ 2019-10-24 14:51  摆渡Ren丶  阅读(18261)  评论(0)  编辑  收藏  举报