Vue-excel-import-export NPM

简体中文

🌱vue2.x

# 安装依赖
npm install com-excel-import-export --save
# or
yarn add com-excel-import-export --save

# main.js 导入 or 组件引用 
import comExcel from 'com-excel-import-excel'

Vue.install(comExcel)


# 示例1 组件使用
<com-excel-import-excel ref="excel-import"/>
this.$refs['excelImport'].importToExcel()
this.$refs['excelImport'].exportExport()


# 示例2 api使用
# 导入表格
this.$excelFile.importToExcel(function (res) {
  console.log(res)
})

# 导出数据表格
this.$excelFile.exportExport([
    { value: '测试数据11', value1: '测试数2据' ,value3: '测试数据33333'},
    { value: '似懂非懂', value1: '测试数2据' ,value3: '测试数据33333'},
    { value: '测试数据11', value1: '第三方的身份' ,value3: '测试数据33333'},
    { value: '测试数据11', value1: '测试数2据' ,value3: '的身份水电费'},
    { value: '测试数据11', value1: '测试数2据' ,value3: '测试数据33333'},
    { value: '测试数据11', value1: '测试数2据' ,value3: '测试数据33333'},
  ],
  [
    {
      label: '标题1', prop: 'value1',
      children: [
        { label: '标题1-1', prop: 'value' },
        { label: '标题1-2', prop: 'value' },
        { label: '标题1-3', prop: 'value',  
        children: [
            { label: '标题1-3-1', prop: 'value' ,
             children: [
                { label: '标题1-3-1-2', prop: 'value' },
                { label: '标题1-3-1-2', prop: 'value' },
                { label: '标题1-3-1-3', prop: 'value' },
                { label: '标题1-3-1-4', prop: 'value' },
              ],},
            { label: '标题1-3-2', prop: 'value' },
            { label: '标题1-3-3', prop: 'value' },
            { label: '标题1-3-4', prop: 'value' ,
            children: [
                { label: '标题1-3-4-1', prop: 'value' },
                { label: '标题1-3-4-2', prop: 'value' },
                { label: '标题1-3-4-3', prop: 'value' },
                { label: '标题1-3-4-4', prop: 'value' },
              ],
              },
          ], },
        { label: '标题1-4', prop: 'value',
         children: [
            { label: '标题1-1', prop: 'value' },
            { label: '标题1-2', prop: 'value' },
            { label: '标题1-3', prop: 'value' },
            { label: '标题1-4', prop: 'value' },
          ], },
      ],
    },
    { label: '标题2', prop: 'value1' },
    { label: '标题3', prop: 'value3' },
    { label: '标题4', prop: 'value1' },
])