vue.js中使用Export2Excel导出Excel表格

  作者:chrispy

1.安装依赖npm install -S file-saver xlsxnpm install -D script-loader2.导入两个JS下载Blob.js和Export2Excel.js,在src目录下新建Excel文件夹,里面放入Blob.js和Export2Excel.js两个JS文件

1.安装依赖

npm install -S file-saver xlsx

npm install -D script-loader

 

2.导入两个JS

下载Blob.js和Export2Excel.js,在src目录下新建Excel文件夹,里面放入Blob.js和Export2Excel.js两个JS文件

 

3.main.js 引入文件

import Blob from './excel/Blob'

import Export2Excel from './excel/Export2Excel.js'

 

4.组件中使用

// 导出的方法

    loadingFun () {

      loadingInstance = Loading.service(options)

      this.dowExcelList = []

      this.getExportExcelData()

    },

    async getExportExcelData () {

      this.dowCurrentPage++

      const params = `?tenantId=${this.search.tenantId}&projectId=${this.search.projectId}&createTimeStart=${this.search.createTimeStart}

                      &createTimeEnd=${this.search.createTimeEnd}&identity=${this.search.identity}&sort=${this.search.sort}

                      &pageSize=10&currentPage=${this.dowCurrentPage}`

      const result = await getDownStatisticsGetAgentRankList(params)

      this.dowExcelList = this.dowExcelList.concat(result.data)

      if (this.dowCurrentPage < result.page.pageCount) {

        let totalPage = result.page.pageCount

        let currentPage = result.page.currentPage

        let Speed = parseInt((currentPage / totalPage) * 100)

        loadingInstance.text = `导出进度 ${Speed}%`

        this.getExportExcelData(params)

      } else {

        this.export2Excel()

      }

    },

    export2Excel () {

      loadingInstance.text = `导出进度完成开始下载`

      require.ensure([], () => {

        const { exportJsonToExcel } = require('../../vendor/Export2Excel')

        const tHeader = ['渠道身份', '姓名', '全部报备'] // 上面设置Excel的表格第一行的标题

        const filterVal = ['identityname', 'name', 'allNum'] // 上面的index、nickName、name是tableData里对象的属性

        const list = this.dowExcelList // 把data里的tableData存到list

        const data = this.formatJson(filterVal, list)

        exportJsonToExcel(tHeader, data, '列表excel')

      })

      setTimeout(() => {

        loadingInstance.close()

      }, 500)

    },

    formatJson (filterVal, jsonData) {

      return jsonData.map(v => filterVal.map(j => v[j]))

    }


猜你喜欢