vue-json-csv v2.1.0

Vue JSON to CSV file

VueJS component to export Json Data into CSV file and download the resulting file.

Example

GitHub Pages

Getting started

Get the package:

yarn add vue-json-csv

Register JsonCSV in your app entrypoint:

import Vue from 'vue'
import JsonCSV from 'vue-json-csv'

Vue.component('downloadCsv', JsonCSV)

In your template

<download-csv
    :data   = "json_data">
    Download Data
    <img src="download_icon.png">
</download-csv>

Props List

Example

import Vue from 'vue'
import JsonCSV from 'vue-json-csv'

Vue.component('downloadCsv', JsonCSV)

const app = new Vue({
    el: '#app',
    data: {     
        json_data: [
            {
                'name': 'Tony Peña',
                'city': 'New York',
                'country': 'United States',
                'birthdate': '1978-03-15',
                'phone': {
                    'mobile': '1-541-754-3010',
                    'landline': '(541) 754-3010'
                }
            },
            {
                'name': 'Thessaloniki',
                'city': 'Athens',
                'country': 'Greece',
                'birthdate': '1987-11-23',
                'phone': {
                    'mobile': '+1 855 275 5071',
                    'landline': '(2741) 2621-244'
                }
            }
        ]
    }
})

In your Template call it like

<download-csv
	class   = "btn btn-default"
	:data   = "json_data"
	name    = "filename.csv">

	Download CSV (This is a slot)

</download-csv>

REQUIRED

• json_data: Contains the data you want to export

License

MIT