当前位置: 首页 > article >正文

vue中使用xlsx插件导出多sheet excel实现方法

安装xlsx,一定要注意版本: 

npm i xlsx@0.17.0 -S

package.json:

{
  "name": "hello-world",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build"
  },
  "dependencies": {
    "element-ui": "^2.15.12",
    "file-saver": "^2.0.5",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "xlsx": "^0.17.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-plugin-component": "^1.1.1",
    "less": "^3.0.4",
    "less-loader": "^5.0.0",
    "vue-cli-plugin-element": "^1.0.1",
    "vue-template-compiler": "^2.6.11"
  }
}

App.vue:

<template>
  <div id="app">
    <el-button type="primary" @click="exportExcel">vue xlsx导出多sheet excel</el-button>
  </div>
</template>

<script>
  import XLSX from "xlsx";
  export default {
    methods: {
      exportExcel() {
        var data1 = [
          ["id", "name", "hot"],
          [1, "C++", 99],
          [2, "JavaScript", 98]
        ];
        var data2 = [
          ["id", "语言", "热度"],
          [1, "C++", 99],
          [2, "JavaScript", 98]
        ];
        const ws1 = XLSX.utils.aoa_to_sheet(data1);
        const ws2 = XLSX.utils.aoa_to_sheet(data2);

        /* generate workbook and add the worksheet */
        const wb = XLSX.utils.book_new();
        // XLSX.utils.book_append_sheet(wb, ws, "test");
        XLSX.utils.book_append_sheet(wb, ws1, "月度统计报表");
        XLSX.utils.book_append_sheet(wb, ws2, "隔离库");

        /* save to file */
        XLSX.writeFile(wb, "test.xlsx");
      }
    }
  };
</script>


http://www.kler.cn/a/106268.html

相关文章:

  • React中组件通信的几种方式
  • vue3 如何调用第三方npm包内部的 pinia 状态管理库方法
  • 21.3D surface
  • <websocket><PLC>使用js和html实现webscoket,与PLC进行socket通讯的实例
  • linux笔记(防火墙)
  • WebSocket简易聊天室实现(有详细解释)
  • 行为型模式-状态模式
  • C++重载 强制类型转换运算符
  • 论文阅读(一)城市干道分段绿波协调控制模型研究
  • endnote设置
  • reactNative导入excel文件
  • 上架用的SDK三方应用隐私
  • xml导出pdf简单实现
  • 软考高级系统架构师冲关预测
  • 【牛牛送书 | 第二期】《ChatGPT 驱动软件开发:AI 在软件研发全流程中的革新与实践》
  • 易基因: Nature Biotech:番茄细菌性青枯病的噬菌体联合治疗|国人佳作
  • 【Matlab2016】Matlab中文版的下载、安装、激活(不建议安装过高版本!!)
  • 特殊类设计[下] --- 单例模式
  • Spring Boot整合OAuth2实现GitHub第三方登录
  • java开发中,如何在springboot下使用单例模式
  • C语言 sizeof 函数内部进行计算
  • 计算机网络【CN】子网划分与子网掩码
  • 构建客户门户的痛点及低代码工具解决方案
  • c++编译使用log4cplus
  • 系列十四、Spring如何处理线程安全问题
  • 基于STC系列单片机实现定时器扫描数码管显示定时器/计数器产生频率的功能