前端自定义实现文件的导出

1. 下载工具包

   npm install just-xlsx-export

2. 在文件中引用(配置可以参考 https://www.npmjs.com/package/js-xlsx)

   <template>
     <div class="about">
       <button @click.stop="handleExportTest">导出测试</button>
     </div>
   </template>
   
   <script>
   import {
         
          getSheets, downloadExcel } from "just-xlsx-export";
   export default {
         
         
     data() {
         
         
       return {
         
         };
     },
   
     mounted() {
         
         },
     methods: {
         
         
       handleExportTest() {
         
         
         const header = Array(13).fill("");
         const mid = Array(13).fill("");
         const date = Array(13).fill("");
         const year = new Date().getFullYear();
         const list1 = Array(13).fill(Math.random().toString().substr(2, 2));
         list1.splice(0, 1, "合同额");
         const list2 = Array(13).fill(Math.random().toString().substr(2, 2));
         list2.splice(0, 1, "信息费");
   
         date.forEach((item, index, array) => {
         
         
           if (index) {
         
         
             array[index] = index + "月";
           }
         });
   
         header[0] = `${
           
           year}年业绩统计报表`;
         mid[0] = `公司：${
           
           "郑州一店"}`;
         mid[6] = `单位：万元`;
   
         const sheet = getSheets([header, mid, date, list1, list2]);
   
         sheet["!merges"] = [
           // r为纵向合并，范围是第1列的行1到行2
           {
         
          s: {
         
          r: 0, c: 0 }, e: {
         
          r: 0, c: 12 } },
           // c为横向合并，范围是第1行的列2到列4
           {
         
          s: {
         
          r: 1, c: 0 }, e: {
         
          r: 1, c: 5 } },
           {
         
          s: {
         
          r: 1, c: 6 }, e: {
         
          r: 1, c: 12 } },
         ];
   
         let arrFilter = Object.keys(sheet).filter((item) => {
         
         
           return item[0] !== "!";
         });
   
         arrFilter.forEach((item) => {
         
         
           sheet["A1"].s = {
         
         
             font: {
         
         
               bold: true,
               sz: "16",
               color: "#ffffff",
             },
             alignment: {
         
         
               horizontal: "center",
               vertical: "center",
             },
           };
           sheet[item].s = {
         
         
             alignment: {
         
         
               horizontal: "center",
               vertical: "center",
             },
           };
         });
         downloadExcel(sheet, "测试");
       },
     },
   };
   </script>
   
   

3. 实现效果