/vxe-table-plugin-excel

🌿 基于 vxe-table 表格的增强插件，实现简单的 Excel 表格（实验功能，仅供参考）

Primary LanguageTypeScriptMIT LicenseMIT

vxe-table-plugin-excel

gitee star npm version npm downloads gzip size: JS gzip size: CSS npm license

基于 vxe-table 2.x 表格的增强插件，实现简单的 Excel 表格（实验功能，仅供参考）

Installing

npm install xe-utils vxe-table vxe-table-plugin-excel
import Vue from 'vue'
import VXETable from 'vxe-table'
import VXETablePluginExcel from 'vxe-table-plugin-excel'
import 'vxe-table/lib/index.css'
import 'vxe-table-plugin-excel/dist/style.css'

Vue.use(VXETable)
VXETable.use(VXETablePluginExcel)

Demo

<vxe-excel
  ref="xExcel"
  max-height="600"
  :columns="columns"
  :data="tableData">
</vxe-excel>
export default {
  data () {
    let columns = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N']
    return {
      columns: [
        {
          type: 'index',
          width: 50,
          align: 'center',
          headerAlign: 'center'
        }
      ].concat(columns.map(name => {
        return {
          field: name,
          title: name,
          minWidth: 76,
          headerAlign: 'center',
          editRender: {
            name: 'cell'
          }
        }
      })),
      tableData: Array.from(new Array(20)).map((num, index) => {
        let item = {}
        columns.forEach(name => {
          item[name] = ''
        })
        return item
      })
    }
  }
}

License

MIT License, 2019-present, Xu Liangzhan