5丶electron-vue安装js-xlsx,实现Excel导入导出

安装

js-xlsx是一个简单的JavaScript插件,能够读取和写入Excel表格,功能强大,但是上手难度稍大,这里列举一些常用的用法,具体用法请参考js-xlsx

yarn add xlsx // 或 cnpm install -save xlsx

yarn安装方式

npm install -g yarn

cnpm安装方式

npm install -g cnpm --registry=https://registry.npm.taobao.org

导入Excel

在渲染进程目录下src/renderer/main.js如下配置即可,详细每个UI组件用法请参考Element UI

...
import XLSX from 'xlsx'
...
var reader = new FileReader();
        reader.onload = function (e) {
          // 数据预处理
          var binary = "";
          var bytes = new Uint8Array(e.target.result);
          var length = bytes.byteLength;
          for (var i = 0; i < length; i++) {
            binary += String.fromCharCode(bytes[i]);
          }

          /* 读取 workbook */
          var wb = XLSX.read(binary, {
            type: 'binary'
          });

          /* 选择第一个sheet */
          var wsname = wb.SheetNames[0];
          var ws = wb.Sheets[wsname];

          /* excel转换json数组,加上{header:1}是普通数组,不写是对象数组 */
          self.data = XLSX.utils.sheet_to_json(ws);
          console.log(self.data);
...

根据Html导出Excel

  /* html表格转excel */
   var wb = XLSX.utils.table_to_book(document.getElementById('out-table'));
   /* 生成文件,导出D盘 */
   XLSX.writeFile(wb, "D://sheetjs_html.xlsx");

根据Json导出Excel

    /* json数组转换excel */
    var worksheet = XLSX.utils.aoa_to_sheet(this.data);
    var new_workbook = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(new_workbook, worksheet, "sheetjs");
    /* 生成文件,导出D盘 */
    XLSX.writeFile(new_workbook, "D://sheetjs_json.xlsx");

源码

持续更新ing,觉得有用的小伙伴麻烦给我Star
github & 码云

你可能感兴趣的:(electron-vue,electron-vue)