element-ui table 导出, 导入Excel表格

1. 使用npm安装

npm i -S file-saver xlsx script-loader

2. 我这边是在src/renderer 下面新建了一个Excel文件夹,然后把以下两个文件复制过来

链接: https://pan.baidu.com/s/18qBkhCyfyjkuG5OHwxi-JQ 提取码: cn2f

3. 我在我需要导出的页面,引入了

import Blob from "@/execl/Blob.js";

4. 导出所调用的方法:

const { export_json_to_excel } = require("../execl/Export2Excel");

如下截图中 this.tableData是本身要导出的table数据

5. 做完如上这些,网上很多方法说可以呢,可是我点击导出后,页面报错,TypeError: Cannot read property 'encode_cell' of undefined,找了很久的问题,之后在Export2Excel.js中引入了XLSX就没有报错了。

 

 

---------------------------------------------------------------------------------------------------------------------------------------------------------------

然后就是导入表格呢

我下载了依赖 npm i node-xlsx --save, 然后在使用页面引入,

const xlsx = require('node-xlsx')

var obj = xlsx.parse(__static + '/xml/11.xlsx'); // 获取到了Excel表格中的内容

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要使用element-ui导出excel,需要先安装依赖包:`npm install -S file-saver xlsx`,然后在代码中引入相关模块: ```javascript import { export_json_to_excel } from '@/excel/Export2Excel' import XLSX from 'xlsx' import FileSaver from 'file-saver' ``` 其中,`export_json_to_excel`是一个自定义的函数,用于将JSON数据导出Excel文件。具体实现可以参考以下代码: ```javascript export function export_json_to_excel(th, jsonData, defaultTitle) { /* original data */ const data = jsonData data.unshift(th) const ws_name = 'SheetJS' const wb = new Workbook() const ws = sheet_from_array_of_arrays(data) /* add worksheet to workbook */ wb.SheetNames.push(ws_name) wb.Sheets[ws_name] = ws const wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: false, type: 'binary' }) const title = defaultTitle || '列表' saveAs(new Blob([s2ab(wbout)], { type: 'application/octet-stream' }), `${title}.xlsx`) } function sheet_from_array_of_arrays(data) { const ws = {} const range = { s: { c: 10000000, r: 10000000 }, e: { c: 0, r: 0 } } for (let R = 0; R !== data.length; ++R) { for (let C = 0; C !== data[R].length; ++C) { if (range.s.r > R) range.s.r = R if (range.s.c > C) range.s.c = C if (range.e.r < R) range.e.r = R if (range.e.c < C) range.e.c = C const cell = { v: data[R][C] } if (cell.v == null) continue const cell_ref = XLSX.utils.encode_cell({ c: C, r: R }) if (typeof cell.v === 'number') cell.t = 'n' else if (typeof cell.v === 'boolean') cell.t = 'b' else if (cell.v instanceof Date) { cell.t = 'n' cell.z = XLSX.SSF._table[14] cell.v = datenum(cell.v) } else cell.t = 's' ws[cell_ref] = cell } } if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range) return ws } function Workbook() { if (!(this instanceof Workbook)) return new Workbook() this.SheetNames = [] this.Sheets = {} } function datenum(v, date1904) { if (date1904) v += 1462 const epoch = Date.parse(v) const excelEpoch = Date.parse('1900-01-01T00:00:00') return (epoch - excelEpoch) / (24 * 60 * 60 * 1000) } function s2ab(s) { const buf = new ArrayBuffer(s.length) const view = new Uint8Array(buf) for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xff return buf } ``` 使用时,只需要调用`export_json_to_excel`函数即可: ```javascript exportExcel() { require.ensure([], () => { const { export_json_to_excel } = require('@/excel/Export2Excel') const tHeader = ['姓名', '年龄', '性别', '爱好', '地址'] const filterVal = ['name', 'age', 'sex', 'interest', 'address'] const list = this.tableData const data = this.formatJson(filterVal, list) export_json_to_excel(tHeader, data, '列表') }) } ``` 其中,`tHeader`是表头,`filterVal`是要导出的字段,`list`是要导出的数据。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值