Vue3 导入导出Excel

2023-03-14 14:18:59
2023-06-03 10:06:24

安装

pnpm add -S XLSX

方法封装

import * as XLSX from 'xlsx';

//参数说明
//configuration: {
//  data: [], // 导出的数据
//  head: {}, // 导出的数据对应的表头
//  name: '', // 导出的文件名
//  label: '', // 导出的表单名
//  widthArr: [], // 导出的表单列宽
//}

// 导出excel
export const ExportXlsx = (configuration) => {
  const { data, head, name, label, widthArr } = configuration;

  const list = data.map((item) => {
    const obj = {};
    for (const k in item) {
      if (head[k]) {
        obj[head[k]] = item[k];
      }
    }
    return obj;
  });

  // 创建工作表
  const xLSXData = XLSX.utils.json_to_sheet(list);
  // 创建工作簿
  const wb = XLSX.utils.book_new();
  // 将工作表放入工作簿中
  XLSX.utils.book_append_sheet(wb, xLSXData, label);
  xLSXData['!cols'] = [];
  // 设置列宽
  widthArr.forEach((item) => {
    xLSXData['!cols'].push({ wpx: item });
  });

  // 生成文件并下载
  XLSX.writeFile(wb, `${name}.xlsx`);
};

// 导入excel
export const ImportXlsx = (e) => {
  const file = e.target.files[0];
  const reader = new FileReader();
  reader.readAsArrayBuffer(file);
  reader.onload = (e) => {
    const data = e.target.result;
    const workbook = XLSX.read(data, { type: 'binary', cellDates: true });
    const wsname = workbook.SheetNames[0];
    const outdata = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]);
    console.log(outdata);
  };
};
目录
qq

qq

回复
亚太地区 - 0
Chrome113.0.0.0
Windows10
2023-06-04 07:51:47
小白龙

大佬猛

回复
广东省 - 广州市
Chrome113.0.0.0
Windows10
2023-05-23 21:35:48
梅西

下届带你踢世界杯

回复
广东省 - 广州市
Edge113.0.1774.35
Windows10
2023-05-11 16:32:27
1
回复
11

1

111

回复
0 - 内网IP
Chrome113.0.0.0
Windows10
2023-06-03 14:12:43
11
回复
1

111

111

回复
亚太地区 - 0
Chrome113.0.0.0
Windows10
2023-06-03 13:58:47
1
回复
大白龙

111

测试新版本

回复
亚太地区 - 0
Chrome113.0.0.0
Windows10
2023-06-03 13:58:14
大白龙
回复
大白龙

测试新版本

我要回复小白龙

回复
广东省 - 广州市
Chrome113.0.0.0
Windows10
2023-05-27 17:12:38
大白龙
回复
小白龙

我要回复小白龙

可以哇

回复
0 - 内网IP
Chrome112.0.0.0
Windows10
2023-05-11 22:10:32
小白龙

可以哇

回复
广东省 - 广州市
Chrome112.0.0.0
Windows10
2023-05-11 21:26:09
贝克汉姆

明天带你踢世界杯

回复
广东省 - 广州市
Edge113.0.1774.35
Windows10
2023-05-11 16:24:56
开飞机能记录吗?

**哈哈

回复
广东省 - 广州市
Edge113.0.1774.35
Windows10
2023-05-11 15:13:01
测试

浏览器版本,系统版本

回复
广东省 - 广州市
Chrome112.0.0.0
Windows10
2023-05-09 23:26:38
爱慕你的大舅哥

太崇拜了

回复
中国|0|广东省|广州市|移动
未知
未知
2023-04-19 13:47:05
test

12345

回复
中国|0|上海|上海市|联通
未知
未知
2023-03-17 14:41:07
IP地址

IP地址

回复
中国|0|辽宁省|大连市|联通
未知
未知
2023-03-08 16:32:12
怎么没有人留言

为什么为什么为什么

回复
中国|0|广东省|广州市|电信
未知
未知
2023-02-21 08:32:35
  • 1
  • 2
  • 3
  • 4

运营需要亿点资金维持,您的支持,是小白龙创作的动力!!!