zoukankan      html  css  js  c++  java
  • angular8 Vue 导出excel文件

    angular

    package

    1、xlsx  

      npm install xlsx --save

    2、file-saver

      npm install file-saver --save

      npm install @types/file-saver --save

    3、angular实现导出多个sheet的数据

    exportExcel() {
        import("xlsx").then(xlsx => {
          // const worksheet = xlsx.utils.json_to_sheet(this.getCars());
          console.log(this.BeautifuleValue);
          var all = [
            [],
            [],
            []
          ];
          this.BeautifuleValue.districtBeautifyAdjustedValue.forEach(element => {
            all[0].push(
              {
                '区县': this.districtName[element.customer],
                '美化系数': element.coefficient,
                '美化值': element.beautifyValue
              }
            );
          });
          this.BeautifuleValue.platBeautifyAdjustedValue.forEach(element => {
            all[1].push(
              {
                '平台': this.platName[element.plat],
                '美化系数': element.coefficient,
                '美化值': element.beautifyValue
              }
            );
          });
          this.BeautifuleValue.industryBeautifyAdjustedValue.forEach(element => {
            all[2].push(
              {
                '行业': element.industry,
                '美化系数': element.coefficient,
                '美化值': element.beautifyValue
              }
            );
          });
          const oneSheet = xlsx.utils.json_to_sheet(all[0]);
          const twoSheet = xlsx.utils.json_to_sheet(all[1]);
          const threeSheet = xlsx.utils.json_to_sheet(all[2]);
          const workbook = { Sheets: { '区县': oneSheet, '平台': twoSheet, '行业': threeSheet }, SheetNames: ['区县', '平台', '行业'] };
          const excelBuffer: any = xlsx.write(workbook, { bookType: 'xlsx', type: 'array' });
          this.saveAsExcelFile(excelBuffer, "美化值");
        });
      }
    
      saveAsExcelFile(buffer: any, fileName: string): void {
        import("file-saver").then(FileSaver => {
          let EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
          let EXCEL_EXTENSION = '.xlsx';
          const data: Blob = new Blob([buffer], {
            type: EXCEL_TYPE
          });
          FileSaver.saveAs(data, fileName + '_export_' + new Date().getTime() + EXCEL_EXTENSION);
        });
      }

     4、vue导出

    
    
        export(){
          let exportExcelList = [
            {
              "机构编号": 111111,
              "机构名称": 111111,
            },
            {
              "机构编号": 111111,
              "机构名称": 111111,
            }
          ];
          import("xlsx").then(xlsx => {
              // const worksheet = xlsx.utils.json_to_sheet(this.getCars());
              console.log(this.BeautifuleValue);
              const oneSheet = xlsx.utils.json_to_sheet(exportExcelList);
              const workbook = {
                Sheets: { 组织机构: oneSheet },
                SheetNames: ["组织机构"]
              };
              const excelBuffer = xlsx.write(workbook, {
                bookType: "xlsx",
                type: "array"
              });
              this.saveAsExcelFile(excelBuffer, "组织机构数据 " + new Date());
            });
        },
     
        saveAsExcelFile(buffer, fileName) {
          /**
           * 导出数据fun
           */
          import("file-saver").then(FileSaver => {
            let EXCEL_TYPE =
              "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8";
            let EXCEL_EXTENSION = ".xlsx";
            const data = new Blob([buffer], {
              type: EXCEL_TYPE
            });
            FileSaver.saveAs(
              data,
              fileName + "_export_" + new Date().getTime() + EXCEL_EXTENSION
            );
          });
        }
     




  • 相关阅读:
    Laravel报错Call to undefined function IlluminateEncryptionopenssl_cipher_iv_length()
    总结:关于留学网站使用laravel框架的总结
    Laravel5 call to undefined function openssl cipher iv length() 报错 PHP7开启OpenSSL扩展失败
    call undefined function openssl_cipher_iv_length
    Laravel 出现 No application encryption key has been specified.
    Lavarel之环境配置 .env
    laravel怎么开启调试模式
    composer windows安装,使用新手入门
    windows下如何安装Composer?
    39个大数据可视化工具,哪个才是你的菜?
  • 原文地址:https://www.cnblogs.com/shuangzikun/p/12028480.html
Copyright © 2011-2022 走看看