随笔 - 135  文章 - 0  评论 - 2  阅读 - 18万

vue导出excel

1. 全部导出

复制代码
    <div class="toexcel">
      <el-button
        @click="exportExcel"
        type="primary"
        class="button"
        style="width:70px;position:absolute;top:0;right:30px"
        >导出</el-button
      >
    </div>
复制代码
复制代码
      <el-table
        :data="tableData"
        :span-method="objectSpanMethod"
        :header-cell-style="{ background: '#cef4f1', color: '#606266' }"
        border
        :cell-style="tableCellStyle"
        style=" margin-top: 20px"
        width="100%"
        class="table"
      >
复制代码

 

复制代码
    function exportExcel () {
      // 设置当前日期
      // const time = new Date()
      // const year = time.getFullYear()
      // const month = time.getMonth() + 1
      // const day = time.getDate()
      // const name = year + '' + month + '' + day
      const name = '表格测试'
      // 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'
        )
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout)
      }
      return wbout
    }
复制代码

 

posted on   稳住别慌  阅读(1415)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示