Vue 简单导出Excel

最新推荐文章于 2024-08-06 16:10:14 发布

旧友前度丶

最新推荐文章于 2024-08-06 16:10:14 发布

阅读量420

点赞数

本文链接：https://blog.csdn.net/wangyangzxc123/article/details/123325572

版权

关键词由CSDN通过智能技术生成

// 下包 xlsx  
// 下包 file-saver 
npm install --save xlsx file-saver

// 导包
import FileSaver from 'file-saver'
import XLSX from 'xlsx'

// 导出按钮
<el-button class="btn-search" type="primary" plain size="small" @click="exportExcel()">导出Excel</el-button>

// 导出对应的js代码
exportExcel () {
      // 设置当前日期
      // let time = new Date()
      // let year = time.getFullYear()
      // let month = time.getMonth() + 1
      // let day = time.getDate()
      // let name = year + '' + month + '' + day
      // console.log(name)
      /* generate workbook object from table */
      //  .table要导出的是哪一个表格
      var wb = XLSX.utils.table_to_book(document.querySelector('#table'))
      /* get binary string as output */
      var wbout = XLSX.write(wb, {
        bookType: 'xlsx',
        bookSST: true,
        type: 'array'
      })
      try {
        //  name+'.xlsx'表示导出的excel表格名字
        FileSaver.saveAs(
          new Blob([wbout], { type: 'application/octet-stream' }),
          // name + '.xlsx'  name可以自定义, .xlsx是导出的格式
          '导出.xlsx'
        )
      } catch (e) {
        if (typeof console !== 'undefined') {
        }
      }
      return wbout
    },