函数将数组转换为excel反应

Question

我正在寻找一个可以将数组转换为 excel 以完成材料 UI 表数据导出到 excel 的函数，我是新手，所以我不知道要创建这个函数，这是我的代码：

import {
    GridToolbarContainer,
    gridVisibleSortedRowIdsSelector,
    gridFilteredSortedRowIdsSelector,
    gridVisibleColumnFieldsSelector
  } from "@mui/x-data-grid";


  const CustomToolbar = () => {

    const apiRef = useGridApiContext();
    const getFilteredRows = ({ apiRef }) => gridVisibleSortedRowIdsSelector(apiRef);
    const handleExport = (options) => apiRef.current.exportDataAsCsv(options);
    
    const buttonBaseProps = {
        color: "primary",
        size: "small",
      };
   
    const arrayToExcel = (a) => {

    }

    const myfiltredRows = (a) => {
        const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef);
        const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
    
        let data = filteredSortedRowIds.map((id) => {
          const row = {};
          visibleColumnsField.forEach((field) => {
            row[field] = apiRef.current.getCellParams(id, field).value;
          });
          return row;
        });
        //let m = JSON.stringify(data, null, 2);
        data.map((d) => {(delete d.__check__,delete d.action)})
        console.info(data)
        arrayToExcel(data)
      };

    return (
      <GridToolbarContainer>
        <Button
          {...buttonBaseProps}
          onClick={() => myfiltredRows(getFilteredRows)
            /*handleExport({ getRowsToExport: getFilteredRows })*/}> Filtered rows</Button>
      </GridToolbarContainer>
    );
  }

我要完成这个函数const arrayToExcel = (a) => {}

Answer 1

您可以使用以下代码将其转换为.csv文件

import React from "react";

let arrayList = [
  ["Col1", "Col2", "Col3", "Col4"],
  ["Data", 50, 100, 500],
  ["Data", -100, 20, 100]
];

export const Routes = () => {
  const exportToCsv = () => {
    var CsvString = "";
    arrayList.forEach(function (RowItem, RowIndex) {
      RowItem.forEach(function (ColItem, ColIndex) {
        CsvString += ColItem + ",";
      });
      CsvString += "\r\n";
    });
    CsvString = "data:application/csv," + encodeURIComponent(CsvString);
    var x = document.createElement("A");
    x.setAttribute("href", CsvString);
    x.setAttribute("download", "somedata.csv");
    document.body.appendChild(x);
    x.click();
  };
  return (
    <div>
      <button onClick={exportToCsv}>Export To Csv</button>
    </div>
  );
};