antd本地上传excel文件并读取文件的数据转为json

1.写一个上传

这里直接用upload组件即可

javascript 复制代码
<Upload {...uploadProps} maxCount={1} accept={".xlsx"}>
                      <Button icon={<UploadOutlined />}>
                        {`${formatMessage({id: 'clk_upload'}, {file: formatMessage({id: 'excel_file'})})}`}
                      </Button>
                    </Upload>

2.写props

javascript 复制代码
const uploadProps: any = {
    onRemove: (file: any) => {
      const index = fileList.indexOf(file);
      const newFileList = fileList.slice();
      newFileList.splice(index, 1);
      setFileList(newFileList);
    },
    beforeUpload: (file: any) => {
      let reader = new FileReader();
      reader.onload = function(event: any) {
        let data = new Uint8Array(event.target.result);
        let workbook = XLSX.read(data, {type: 'array'});
        let worksheet = workbook.Sheets[workbook.SheetNames[0]];
        let jsonData = XLSX.utils.sheet_to_json(worksheet, {header: 1});
      reader.readAsArrayBuffer(file);
      setFileList(file?.name?.includes('xlsx') ? [file]: []);
      return false;
    },
    fileList
  };

beforeUpload函数里处理上传的数据转成Uint8Array,读取文件中的第一个表,使用.utils.sheet_to_json方法读出json数据,具体在进行处理即可。

相关推荐
用户311879455921811 分钟前
CentOS 7 安装 bzip2-libs-1.0.6-13.el7.x86_64.rpm 的详细步骤
linux
ZLRRLZ15 分钟前
【Linux操作系统】进程控制
linux·运维·服务器
我想吃余27 分钟前
Linux的Ext文件系统:硬盘理解和inode及软硬链接
linux·运维·电脑
qq762118221 小时前
Linux c 在内存中创建zip,最后写入测试
linux·运维·服务器
半路_出家ren1 小时前
Shell脚本基础应用
linux·网络·shell
叶九灵不灵2 小时前
csv & excel
excel
誰能久伴不乏2 小时前
如何在 Linux_Ubuntu 上安装 Qt 5:详细教程
linux·qt·ubuntu
dualven_in_csdn2 小时前
ubuntu离线安装 xl2tpd
linux·数据库·ubuntu
IT成长日记7 小时前
【Nginx开荒攻略】Nginx虚拟主机配置:从域名、端口到IP的完整指南
linux·运维·服务器·nginx·虚拟主机
迎風吹頭髮9 小时前
Linux内核架构浅谈8-Linux内核与UNIX的传承:设计思想与特性差异
linux·运维·架构