vue3-excel-parser v1.0.5

vue3-excel-parser

包简答说明

这是一个 vue3 的关于 excel 解析的包，支持导入 excel 并且自定义字段名，也支持将对象数组导出为 excel，导出也支持自定义字段

字段说明

对于ExcelExporter:
data：任意类型的对象数组，需要长度大于0，作为excel的内容，必选
fileName：字符串类型，文件名，后缀为excel后缀名，不然会产生显示异常，必选
workSheet：字符串类型，工作卡的名字，可选，默认值：'Sheet 1'
fields：对象，指定导出excel的表头名，对象的key需要与导出data的每一个对象的key保持一致，或者为子集，可选，默认值为对象的key
exportFields：字符串数组，指定导出哪些字段，每一个字符串必须是对象的key，可选，默认导出所有字段

对于ExcelImporter:
data：任意类型的对象数组，用来作为导入内容存放的容器，必须为响应式对象，使用v-model:data = 'data'传入，必选
fields：对象，指定导入对象数组中每一个对象的key，fields的key需要与excel表头字段对应，或者为子集，可选，默认值为excel表头字段
importFields：字符串数组，指定导入哪些字段，每一个字符串必须是excel的表头，可选，默认导入所有字段

使用例子

<template>
  <div>
    <ExcelImporter
      v-model:data="excelData"
      :fields="{
        姓名: 'name',
        年龄: 'age',
        性别: 'sex',
        手机号码: 'tele',
      }"
      :importFields="['name','age']">
      <button>点击导入</button>
    </ExcelImporter>
    <ExcelExporter
      :data="excelData"
      file-name='test.xlsx'
      :fields="{
        name: '姓名',
        age: '年龄',
        sex: '性别',
        tele: '手机号码',
      }"
      :exportFields="['name','age']">
      <button>点击导出</button>
    </ExcelExporter>
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';
import { ExcelImporter, ExcelExporter } from 'vue3-excel-parser';
const excelData = reactive<any[]>([]);
</script>

注意事项

1. 自定义字段 fields 的 key 必须与 excel 中的表头一一对应，如 excel 的表头是姓名、年龄，那么 fields 应该这么书写，否则会抛出错误

//'name'便是姓名的自定义字段
{
   姓名:'name',
   年龄:'age'
}

2. 使用导入器的时候必须导入 excel 文件，否则会抛出错误
3. 导出文件名后缀必须是 excel 文件后缀