vue-element-admin項目實現excel表格導出

1. 安裝依賴

npm install xlsx file-saver -S
npm install script-loader -S -D

2. 在需要導出excel的頁面執行以下方法

 <el-button v-if="visible" :loading="downloadLoading" style='float:right;margin:7px 10px 0 0 ' size="mini" type="info" icon="el-icon-document" @click='exportExcel'>導出xlsx文件</el-button>

    exportExcel(){

      this.downloadLoading = true  


        const filterVal = ['time', 'avolt', 'bvolt', 'cvolt']

         const list = [
           {time:'1',avolt:'220',bvolt:'220',cvolt:'220'},
           {time:'2',avolt:'220',bvolt:'220',cvolt:'220'},
           {time:'3',avolt:'220',bvolt:'220',cvolt:'220'},
         ]

        const data = this.formatJson(filterVal, list)      

       import('@/vendor/Export2Excel').then(excel => {
        excel.export_json_to_excel({
          header: this.excelHear, //表頭 必填
          data, //具體數據 必填
          filename: this.label, //非必填
          autoWidth: true, //非必填
          bookType: 'xlsx' //非必填
        })

        
      })
      
      this.downloadLoading = false

    },