如何在ReactJs中等待CSV回传并解析promise？

npm install csv-parser axios

import React, { useState } from 'react';
import axios from 'axios';
import * as csvParser from 'csv-parser';

function MyComponent() {
  const [csvData, setCsvData] = useState([]);

  const handleFileUpload = (event) => {
    const file = event.target.files[0];
    const promise = new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.onload = (e) => {
        resolve(e.target.result);
      };
      reader.onerror = (e) => {
        reject(new Error('Unable to read the file'));
      };
      reader.readAsText(file);
    });

    promise
      .then((csvContent) => {
        return new Promise((resolve, reject) => {
          const parsedData = [];
          const stream = csvParser({ headers: false })
            .on('data', (row) => parsedData.push(row))
            .on('end', () => resolve(parsedData))
            .on('error', (error) => reject(error));

          stream.write(csvContent);
          stream.end();
        });
      })
      .then((parsedData) => {
        setCsvData(parsedData);
      })
      .catch((error) => {
        console.error(error);
      });
  };

  return (
    <div>
      <input type="file" onChange={handleFileUpload} />
      {csvData.map((row, index) => (
        <div key={index}>{JSON.stringify(row)}</div>
      ))}
    </div>
  );
}

export default MyComponent;