SHARE
TWEET

Untitled

a guest Jun 12th, 2019 60 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from 'react'
  2.  
  3. export default class JsonToCsv extends React.Component{
  4.     // função que faz Download do Arquivo .csv
  5.     download(data){
  6.        const blob = new Blob([data], {type: 'text/csv'})
  7.     //    console.log(blob)
  8.        const url = URL.createObjectURL(blob)
  9.        const a = document.createElement('a')
  10.        a.setAttribute('hidden', '')
  11.        a.setAttribute('href', url)
  12.        a.setAttribute('download', `Download-${this.props.id}.csv`)
  13.        document.body.appendChild(a)
  14.        a.click()
  15.        document.body.removeChild(a)
  16.     }
  17.    
  18.     //função que tranforma objeto em CSV
  19.     objectToCsv(data){
  20.         const csvRows = [];
  21.  
  22.         // get os Headers do Objeto
  23.         const headers = Object.keys(data[0])
  24.         csvRows.push(headers.join(','))
  25.  
  26.         // loop nas rows do object
  27.         for (const row of data){
  28.             const values = headers.map(header =>{
  29.                 // replace pra substituir ',' por  '\'
  30.                 const escaped = (''+row[header]).replace(/"/g, '\\"')
  31.                 return `"${escaped}"`
  32.             })
  33.            csvRows.push(values.join(','))
  34.         }
  35.         return csvRows.join('\n')
  36.     }
  37.    
  38.    
  39.     // função Main, invoca a função objectToCsv que tranforma JSON em CSV
  40.     mainCsv(csv){
  41.         return () =>{
  42.             const csvData = this.objectToCsv(csv)
  43.             // console.log(csv)
  44.             this.download(csvData)
  45.        }
  46.   }
  47.     render(){
  48.         return (
  49.             <div>
  50.                 {*/ aqui eu tenho um botão onde no onclick eu chamo uma função passando o objeto que eu quero converter em CSV/*}
  51.             <button className="btn buttonConsultar z-depth-2" onClick={this.mainCsv(csv)}>
  52.             <i className="fas fa-file-csv" ></i>
  53.       </button>
  54.             </div>
  55.         )
  56.     }
  57. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 
Top