Convierte archivos de Excel (xlsx, xls, CSV) a formato JSON en React.

Feb 12 2023
Todos tenemos archivos de Excel por ahí que deben convertirse a JSON. Pero el problema es ¿cómo lo hacemos? Bueno, hay muchas maneras y algunas son mejores que otras.
Foto de Lautaro Andreani en Unsplash

Todos tenemos archivos de Excel por ahí que deben convertirse a JSON. Pero el problema es ¿cómo lo hacemos? Bueno, hay muchas maneras y algunas son mejores que otras. En este blog, le mostraré cómo convertir fácilmente sus archivos de Excel a un formato JSON usando Node.js.

¿Qué es Reaccionar?

React es una biblioteca de JavaScript gratuita y de código abierto para crear interfaces de usuario basadas en componentes de interfaz de usuario, desarrollada por Meta, anteriormente conocida como Facebook.

¿Qué es JSON?

JSON significa Notación de objetos de JavaScript. JSON es un formato estándar basado en texto para representar datos estructurados basados ​​en la sintaxis de objetos de JavaScript. Se usa comúnmente para transmitir datos en aplicaciones web.

¡Empecemos!

Para convertir archivos de Excel a formato JSON, utilizaremos la biblioteca 'xlsx' que brinda una amplia gama de funciones para trabajar con hojas de cálculo y manipular su contenido. Puede instalar esta biblioteca ejecutando el siguiente comando en su terminal:

npm install xlsx

Para leer el archivo de Excel, debe usar el método FileReader de xlsx. Después de recibir datos del archivo de Excel, puede usar el sheet_to_jsonmétodo de la biblioteca xlsx para convertirlo al formato JSON.

import React, { useState } from 'react';

const Test = () => {
const submitHandler=(e)=>{

    if (e.target.files) {
        const reader = new FileReader();
        reader.onload = (e) => {
            const data = e.target.result;
            const workbook = read(data, { type: "array" });
            const fileName= workbook.SheetNames[0];
            const sheet = workbook.Sheets[fileName];
            const json = utils.sheet_to_json(sheet);
            console.log("json",json);
        };
        reader.readAsArrayBuffer(e.target.files[0]);
    }
   }
<div>
 <input type="file" onChange={submitHandler}/>
</div>
}
export default Test

Usamos el siguiente archivo de Excel para convertirlo a JSON.

Después de cargar este archivo de Excel, obtendremos datos JSON. Aquí mostramos datos JSON en la tabla.

Gracias por leer el artículo y espero que te haya sido útil.

Enlaces útiles :

PD: "Sin intención de infringir los derechos de autor, Happy Coding".

https://www.linkedin.com/in/yash-baviskar-82250a113