⌗ react-json-to-csv

A react button component to easily generate csv downloads of your json data. ✨

npm downloads

Features

Create a csv download from json data
Lightweight
Easy to use
optional filename

Install

Install with npm:

npm i react-json-to-csv

Or load from a CDN:

<script src="https://cdn.jsdelivr.net/npm/react-json-to-csv"></script>

Example Usage

Easy, breezy, just add data.

  <CsvDownloadButton data={mockData} />

Add a filename or other props.

  <CsvDownloadButton
    data={mockData}
    filename="good_data.csv"
    style={{ //pass other props, like styles
      boxShadow:"inset 0px 1px 0px 0px #e184f3",
      background:"linear-gradient(to bottom, #c123de 5%, #a20dbd 100%)",
      backgroundColor:"#c123de",
      borderRadius:"6px",
      border:"1px solid #a511c0",
      display:"inline-block",
      cursor:"pointer","color":"#ffffff",
      fontSize:"15px",
      fontWeight:"bold",
      padding:"6px 24px",
      textDecoration:"none",
      textShadow:"0px 1px 0px #9b14b3"
      }}
  >
    Good Data ✨
  </CsvDownloadButton>

Props

#	Property	Type	Requirement	Default	Description
1	data	`[]`	`required`		array of objects
2	filename	`string`	`optional`	"export.csv"	The filename. The `.csv` extention will be edded if not included in file name
3	delimiter	`string`	`optional`	";"	fields separator
4	headers	`string[]`	`optional`	provided data object keys	List of columns that will be used in the final CSV file.

Contributing

Please help provide good data faster! Submit any issues and/or make a pull request!