1.0.7 • Published 1 year ago

react-json-to-excel v1.0.7

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

React json to excel

NPM [npm version]

Install

npm install react-json-to-excel --save

Peer modules

npm install file-saver xlsx --save
npm install react-json-to-excel --save

Using Button Component

import { JsonToExcel } from "react-json-to-excel";

class SmapleComponent extends Component {
  render() {
    return (
      <JsonToExcel
        title="Download as Excel"
        data={[{ test: "test" }]}
        fileName="sample-file"
        btnClassName="custom-classname"
      />
    );
  }
}

Usage

import { JsonToExcel } from "react-json-to-excel";
const samplejson1 = [
  { label: "C" },
  { label: "Java" },
  { label: "Go" },
  { label: "Javascript" },
  { label: "HTML" },
  { label: "CSS" },
  { label: "REACT" },
  { label: "JQUERY" }
];

const samplejson2 = [
  { name: "name01" , age:"20",sex:"M" },
  { name: "name02" , age:"22",sex:"F" }
  { name: "name03" , age:"20",sex:"M" }
];

class SmapleComponent2 extends Component {
  render() {
    return (
      <JsonToExcel
        title="Download as Excel"
        data={samplejson}
        fileName="sample-file"
      />
       <JsonToExcel
        title="Download as Excel"
        data={samplejson2}
        fileName="sample-file"
      />
    );
  }
}

Using exportToExcel Method

import { exportToExcel } from 'react-json-to-excel';

  const samplejson2 = [
    { name: 'name01', age: '20', sex: 'M' },
    { name: 'name02', age: '22', sex: 'F' },
    { name: 'name03', age: '20', sex: 'M' },
  ];

class SmapleComponent2 extends Component {

  render() {
    return (
     <button onClick={() => exportToExcel(samplejson2, 'downloadfilename')}>        
        Download using method
      </button>
    );
  }
}

Using exportToExcel Method For Multiple sheets

  • Data object should be as below
  • exportToExcel(data, 'downloadfilename', true ) - should pass true
[{
  sheetName:"sheet1",
  details:[{ name: 'name01', age: '20', sex: 'M' },
    { name: 'name02', age: '22', sex: 'F' },
    { name: 'name03', age: '20', sex: 'M' }]
},{
  sheetName:"sheet2",
  details:[{ name: 'name01', age: '20', sex: 'M' },
    { name: 'name02', age: '22', sex: 'F' },
    { name: 'name03', age: '20', sex: 'M' }]
}]
import { exportToExcel } from 'react-json-to-excel';

  const samplejson2 = [
    { name: 'name01', age: '20', sex: 'M' },
    { name: 'name02', age: '22', sex: 'F' },
    { name: 'name03', age: '20', sex: 'M' },
  ];

class SmapleComponent2 extends Component {

  render() {
    return (
     <button onClick={() => exportToExcel(samplejson2, 'downloadfilename', true )}>        
        Download using method
      </button>
    );
  }
}

Example

Screenshot Screenshot

PROPTYPES

PropTypeInfo
titleStringname of the button
btnClassNameStringclass name added to the the button for css customization
dataArrayarray of objects
fileNameStringdownload file name
btnColorStringcolor of button defatlt to #4CAF50

react-json-to-excel

1.0.7

1 year ago

1.0.6

1 year ago

1.0.5

1 year ago

1.0.4

3 years ago

1.0.3

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago