Tuesday 2 January 2024

React Hooks - file-saver at UI -Convert JOSN to excel file format and download



file-saver in React Hooks

==========================


npm install file-saver


import React from "react";

import FileSaver from "file-saver";


export default function App() {

  function sayHello() {

    var blob = new Blob(["Hello, world!"], {

      type: "text/plain;charset=utf-8"

    });

    FileSaver.saveAs(blob, "hello world.txt");

  }

  

    const downloadTestExcelFile =()=> {

    const data = "Excel File column to get Default column name;

    const blob = new Blob([data], {type: 'text/csv'});

    fileSaver.saveAs(blob, "Downloaded_Custom_file_name");  /// empty excel file

  }


  return (

    <div className="App">

      <button onClick={sayHello}>Click me download txt file!</button>

  

   <button onClick={downloadExcel}>Click me download EXCEL file!</button>

    </div>

  );


No comments:

Post a Comment

React + Typescript_ Module federation _ Micro Front end -Standalone and integrated

Module Federation The Module Federation is actually part of Webpack config. This config enables us to expose or receive different parts of t...