1

I have created a dropdown and selecting a excel file as value and want to convert this file into JSON format this excel file i am importing from assest folder which is inside src folder Here i am importing excel file don't want to upload

 import seniorDeveloper from "../../assests/Software Developer Sr..xlsx";
import juniorDeveloper from "../../assests/Software Developer Jr..xlsx";
   
   
   const handleexceldropdown=(e)=>{
   
   }
   
   <FormControl fullWidth>
      <InputLabel id="demo-simple-select-label">Designation</InputLabel>                                 
                <Select
                  labelId="demo-simple-select-label"
                  id="demo-simple-select"
                  value={Designation}
                  label="Designation"
                  onChange={handleexceldropdown}
                >
            <MenuItem value={seniorDeveloper }>SeniorDev</MenuItem>                                
                                                           
            <MenuItem value={juniorDeveloper}>JuniorDev</MenuItem>                             
                
               </Select>
         </FormControl> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
sandeep
  • 11
  • 4
  • 1
    It’s not clear what you’re asking. Are you asking how to associate a select option to an imported file name or how to convert an Excel file into json? – Dave Newton Jul 11 '22 at 13:12
  • question is not clear, please put your code in question – Mo. Jul 11 '22 at 13:17
  • @DaveNewton i am importing a excel file from assest folder which is inside src folder and i want this excel file to json here i am not uploading just importing and want to convert – sandeep Jul 12 '22 at 04:45
  • What is preventing you from doing so? – Dave Newton Jul 12 '22 at 12:05
  • @DaveNewton i don't know how to do that i can convert when i upload excel file but with import i don't know how to do that without uploading – sandeep Jul 12 '22 at 13:44
  • If you have a file, whether or not it's uploaded, wouldn't the process be the same? – Dave Newton Jul 12 '22 at 13:56
  • if i upload file i can easily get like this "event.target.files[0]" but after importing i am not getting @DaveNewton i am new to react – sandeep Jul 13 '22 at 04:43

1 Answers1

0

this might be a late answer, but to anyone still searching, you can implement same technique as the answer shared here https://stackoverflow.com/a/70330975/16005277 or rather for convenience check the code below as implemented on react.

import * as xlsx from 'xlsx';
import excelFile from './excel/excelfile.xlsx'//get file location url from react src folder


// get file from the imported url
var request = new XMLHttpRequest();
request.open('GET', excelFile, true);
request.responseType = "arraybuffer";
request.onload = function() {


    
    /* convert data to binary string */
    var data = new Uint8Array(request.response);
    var arr = new Array();
    for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
    data = arr.join("");

    //using xlsx library convert file to json
    const workbook = xlsx.read(data, { type: "binary" })
    const sheetName = workbook.SheetNames[0]
    const worksheet = workbook.Sheets[sheetName]
    const json = xlsx.utils.sheet_to_json(worksheet)
    console.log(json)
};
request.send();
Dennis Mwebia
  • 21
  • 1
  • 4