Question

它包含一个名为OnChange的方法，该方法正在读取excel文件。

这是我的upload.js代码，我试图在其中上传excel文件并读取其中包含特定关键字的某些行。我不确定这有什么问题吗？我试图运行它，但它告诉我无法在'FileReader'上执行'readAsBinaryString'：参数1的类型不是'Blob'，并且出现了SyntaxError错误：意外的令牌<< / p>

import React from "react";
import * as XLSX from "xlsx";

class Upload extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      excel_file: ""
    };
    this.onChange = this.onChange.bind(this);
    var excelJsonObj = [];
  }

  onChange(e) {
    let files = e.target.files;
    console.warn("data files", files);
    const file = files.name;
    //var f = document.getElementById("file");
    //var input = f;
    var reader = new FileReader();
    reader.onload = function(e) {
      var fileData = e.target.result;
      var workbook = XLSX.read(fileData, { type: "binary" });
      const wsname = workbook.SheetNames[0];
      const ws = workbook.Sheets[wsname];
      const data = XLSX.utils.sheet_to_csv(ws, { header: 1 });
      console.log("Data>>>" + data);
    };
    reader.readAsBinaryString(files);
  }
  render() {
    return (
      <div>
        <h2>Upload your excel file here</h2>
        <br />
        <span style={{ marginTop: 2 }}>
          <input
            type="file"
            name="file"
            onChange={e => this.onChange(e)}
            id="file"
          />
        </span>
        <br />
        <span style={{ marginTop: 2 }}>
          <input type="submit" name="Save" value="Submit" />
        </span>
      </div>
    );
  }
}

导出默认的上载；

预期结果：-它应读取excel文件并将其显示在浏览器中。

实际结果：- 1. TypeError：无法对'FileReader'执行'readAsBinaryString'：参数1不是'Blob'类型。 2.未捕获的SyntaxError：意外的令牌<< / p>

我正在尝试使用React JS读取Excel文件

0 个答案: