Загрузите файл Excel, экспортируйте его в excel в React JS и сохраните форматирование. Раскрывающийся список должен быть сохранен в файле xlsl

#json #reactjs #excel #react-hooks #export-to-excel

Вопрос:

У меня есть таблица, в которой отображается список продуктов. В строке есть два раскрывающихся списка для выбора единицы измерения (UOM) и страны. Эти раскрывающиеся списки должны быть сохранены после загрузки (экспорта в excel) в файле excel. Используя «react-экспорт-excel» для загрузки. Есть ли способ сделать это? Я не показал код для таблицы, потому что код становился слишком длинным/

 import React, { useState, Fragment } from "react";
import { useHistory } from "react-router-dom";
import ReactExport from "react-export-excel";

const ExcelFile = ReactExport.ExcelFile;
const ExcelSheet = ReactExport.ExcelFile.ExcelSheet;
const ExcelColumn = ReactExport.ExcelFile.ExcelColumn;

const VendorProductCatalog = (props) => {
  const [catalogItems, setCatalogItems] = useState([]);
  const [uomList, setUomList] = useState([]);
  const history = useHistory();



  React.useEffect(() => {
    getCatalogItem();
  }, []);


  const getCatalogItem = () => {
    setUomList([
      {
        "id": 1,
        "name": "EACH"
      },
      {
        "id": 3,
        "name": "LOT"
      },
      {
        "id": 4,
        "name": "MTR"
      },
      {
        "id": 6,
        "name": "SET"
      }
    ]);
    setCatalogItems([
      {
        "id": 27,
        "product_name": "Cup",
        "description": "This is a product.",
        "country": "India",
        "hs_code": 12,
        "uom_id": 1,
        "unit_price": 25
      },
      {
        "id": 29,
        "product_name": "Plate",
        "description": "Intensions",
        "country": "India",
        "hs_code": 56,
        "uom_id": 3,
        "unit_price": 20
      },
      {
        "id": 30,
        "product_name": "Plate",
        "description": "Intensions",
        "country": "India",
        "hs_code": 56,
        "uom_id": 3,
        "unit_price": 20
      }
    ]);
  };
  return (
    <div>
      <div>
      </div>
      <ExcelFile element={<button>Download Data With Styles</button>}>
                <ExcelSheet data={catalogItems} name="Sheet1">
                    <ExcelColumn label="Item Name" value="product_name"/>
                    <ExcelColumn label="Description" value="description"/>
                    <ExcelColumn label="Country of Manufacturing" value="country"/>
                    <ExcelColumn label="HS Code" value="hs_code"/>
                    <ExcelColumn label="UOM" value="uom_id"/>
                    <ExcelColumn label="Unit Price" value="unit_price"/>
                </ExcelSheet>
            </ExcelFile>
    </div>
  );
};
export default VendorProductCatalog;