Converta arquivos do Excel (xlsx, xls, CSV) em formato JSON no React.

Feb 12 2023
Todos nós temos arquivos do Excel por aí que precisam ser convertidos em JSON. Mas o problema é como fazemos isso? Bem, existem muitas maneiras e algumas são melhores que outras.
Foto de Lautaro Andreani no Unsplash

Todos nós temos arquivos do Excel por aí que precisam ser convertidos em JSON. Mas o problema é como fazemos isso? Bem, existem muitas maneiras e algumas são melhores que outras. Neste blog, mostrarei como converter facilmente seus arquivos do Excel em um formato JSON usando Node.js.

O que é Reagir?

React é uma biblioteca JavaScript gratuita e de código aberto para construir interfaces de usuário baseadas em componentes de interface do usuário, desenvolvida pela Meta anteriormente conhecida como Facebook.

O que é JSON?

JSON significa JavaScript Object Notation.JSON é um formato padrão baseado em texto para representar dados estruturados com base na sintaxe do objeto JavaScript. É comumente usado para transmitir dados em aplicativos da web.

Vamos começar!

Para converter arquivos Excel em formato JSON, utilizaremos a biblioteca 'xlsx' que oferece uma ampla gama de recursos para trabalhar com planilhas e manipular seu conteúdo. Você pode instalar esta biblioteca executando o seguinte comando em seu terminal:

npm install xlsx

Para ler o arquivo do Excel, você precisa usar o método FileReader do xlsx. Depois de receber os dados do arquivo excel, você pode usar o sheet_to_jsonmétodo da biblioteca xlsx para convertê-lo em 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 o seguinte arquivo Excel para convertê-lo em JSON.

Depois de carregar este arquivo Excel, obteremos os dados JSON. Aqui exibimos dados JSON na tabela.

Obrigado por ler o artigo e espero que tenha sido útil para você.

Links úteis :

PS: “Sem intenção de violação de direitos autorais, Happy Coding.”

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