如何用“读取excel文件”工具在ReactJS上制作导入excel？

npm install xlsx file-saver

import React from 'react';
import XLSX from 'xlsx';
import { saveAs } from 'file-saver';

class ExcelImporter extends React.Component {
  handleFileChange = (e) => {
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.onload = (event) => {
      const data = new Uint8Array(event.target.result);
      const workbook = XLSX.read(data, { type: 'array' });
      const worksheet = workbook.Sheets[workbook.SheetNames[0]];
      
      // 处理读取到的excel数据，如转为JSON格式、展示、存储等
      // ...
    };
    reader.readAsArrayBuffer(file);
  };

  render() {
    return (
      <div>
        <input type="file" accept=".xlsx, .xls" onChange={this.handleFileChange} />
      </div>
    );
  }
}

export default ExcelImporter;

import React from 'react';
import ExcelImporter from './ExcelImporter';

class App extends React.Component {
  render() {
    return (
      <div>
        <h1>Excel导入示例</h1>
        <ExcelImporter />
        {/* 其他组件内容 */}
      </div>
    );
  }
}

export default App;