【无标题】

最新推荐文章于 2024-06-12 11:59:04 发布

juju4

最新推荐文章于 2024-06-12 11:59:04 发布

阅读量144

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/juju4/article/details/126001574

版权

获取xlsx文件列名

npm install xlsx --save-dev

import * as XLSX from 'xlsx/xlsx.mjs'



  const readFile = (file) => {
    //文件读取
    return new Promise((resolve) => {
      const reader = new FileReader()
      reader.readAsBinaryString(file) //以二进制的方式读取
      reader.onload = (ev) => {
        resolve(ev.target.result)
      }
    })
  }
  async function handle(ev) {
    const file = ev.originFileObj
    if (!file) {
      message.error('文件打开失败')
    } else {
      const data = await readFile(file)
      const workbook = XLSX.read(data, { type: 'binary' }) //解析二进制格式数据
      const wsname = workbook.SheetNames[0]
      const headerData = XLSX.utils.sheet_to_json(workbook.Sheets[wsname], { header: 1 })[0]
      setOption(headerData)//此为列名
    }
  }


  const props = {
    name: 'file',
    maxCount: 1,
    action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
    headers: {
      // authorization: 'authorization-text',
      Origin: '',
    },
    beforeUpload: sizeCheck,
    // showUploadList: false,
    onChange(info) {
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList)
      }

      if (info.file.status === 'done') {
        handle(info.file)
        message.success(`${info.file.name} file uploaded successfully`)
      } else if (info.file.status === 'error') {
        message.error(`${info.file.name} file upload failed.`)
      }
    },
  }

    <Upload {...props}>
      <Button icon={<UploadOutlined />}>点击上传</Button>
    </Upload>