Vue的JSON至CSV转换器

Vue的JSON至CSV转换器
插件名称 vue-json-to-csv
发布时间 2020年8月14日
插件作者 angeliquekom

一个Vue.js 2组件,用于转换和下载csv格式的json。

安装和下载:

# NPM
$ npm install vue-json-to-csv --save

使用

对于vue-cli用户:

import VueJsonToCsv from 'vue-json-to-csv'

对于独立使用:

<script src="vue.min.js"></script>
<!-- 必须把这行放在后面vue.js版 -->
<script src="dist/vue-json-to-csv.min.js"></script>
<script type="text/javascript">
  Vue.use(VueJsonToCsv);
</script>

示例1(简单使用)

使用简单:将生成一个默认按钮。CSV将包含所有标签(名称,姓氏)和数据

<vue-json-to-csv :json-data="[
    { name: 'Joe', surname: 'Roe' },
    { name: 'John', surname: 'Doe' }
  ]">
</vue-json-to-csv>

示例 2(过滤器标签)

带有自定义csv标题的选定标签:将生成一个在插槽中定义的自定义按钮。csv将仅包含带有“ First name”标题和相关数据的“ name”标签。

<vue-json-to-csv :json-data="[
    { name: 'Joe', surname: 'Roe' },
    { name: 'John', surname: 'Doe' }
  ]"
  :labels="{ name: { title: 'First name' } }"
  :csv-title="My_CSV"
  >
  <button>
    <b>我的自定义按钮</b>
  </button>
</vue-json-to-csv>