vxe-table-plugin-export

vxe-table-plugin-export-xlsx

基于 vxe-table 表格的增强插件，支持导出 xlsx 格式

Installing

npm install xe-utils vxe-table vxe-table-plugin-export-xlsx xlsx

import Vue from 'vue'
import VXETable from 'vxe-table'
import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx'
 
Vue.use(VXETable)
VXETable.use(VXETablePluginExportXLSX)

Demo

<vxe-toolbar>
  <template v-slot:buttons>
    <vxe-button @click="exportEvent">导出.xlsx</vxe-button>
  </template>
</vxe-toolbar>
 
<vxe-table
  border
  ref="xTable"
  height="600"
  :data="tableData">
  <vxe-table-column type="index" width="60"></vxe-table-column>
  <vxe-table-column prop="name" label="Name"></vxe-table-column>
  <vxe-table-column prop="age" label="Age"></vxe-table-column>
  <vxe-table-column prop="date" label="Date"></vxe-table-column>
</vxe-table>

export default {
  data () {
    return {
      tableData: [
        {
          id: 100,
          name: 'test',
          age: 26,
          date: null
        }
      ]
    }
  },
  methods: {
    exportEvent() {
      this.$refs.exportData({
        filename: 'export',
        sheetName: 'Sheet1',
        type: 'xlsx'
      })
    }
  }
}

License

MIT License, 2019-present, Xu Liangzhan