vue 导出excel xlsx.js

npm install xlsx@0.17.0
npm install xlsx-js-style@1.2.0
高于0.17有错误

引入
        import xlsx from "xlsx";
        //设置导出excel样式
        import XLSXS from "xlsx-js-style";

 使用说明

    export() {
            let cellItem = {
                "v": "单元格文字内容",
                "t": "s",
                "s": {
                    "font": {
                        "bold": true,
                        "sz": 22
                    },
                    "alignment": {
                        "vertical": "center",
                        "horizontal": "center",
                        "wrapText": 1,
                        "indent": 0
                    },
                    "border": {
                        "bottom": {
                            "style": "thin",
                            "color": "000000"
                        },
                        "left": {
                            "style": "thin",
                            "color": "000000"
                        },
                        "right": {
                            "style": "thin",
                            "color": "000000"
                        },
                        "top": {
                            "style": "thin",
                            "color": "000000"
                        }
                    }
                }
            }
            let tableArrData = [[{ cellItem }, { cellItem }], [{ cellItem }, { cellItem }]]
            // 设置合并单元格
            //每个数组由包含s和e构成的对象组成，s表示开始，e表示结束，r表示行，c表示列;
            let labelMerge = 9//需要合并的个数
            let merges = [
                { s: { r: 0, c: 0 }, e: { r: 0, c: labelMerge } },
                { s: { r: 1, c: 0 }, e: { r: 1, c: labelMerge } },


                { s: { r: 31, c: 1 }, e: { r: 31, c: labelMerge } },
                { s: { r: 32, c: 1 }, e: { r: 32, c: labelMerge } },
                { s: { r: 33, c: 1 }, e: { r: 33, c: labelMerge } },
            ];
            // 设置列宽
            const cols = [
                { wch: 30 },
                { wch: 10 },
                { wch: 30 },
                { wch: 10 },
                { wch: 30 },
                { wch: 10 },
                { wch: 30 },
                { wch: 10 },
                { wch: 30 },
                { wch: 10 },
            ];
            const rows = [{ hpx: 24 }];
            /*
            xlsx使用
            如果不需要单独设置每一个单元格的样式可以直接传入dom节点导出excel,xlsx支持传入多种类型的数据方法名不同
            如需要单独设置单元格的样式选择传入二维数组形式为tableArrData
            arr 的每个元素数组为一行的单元格对象合集，这一行中有多少列该元素数组中就应该有多少个单元格对象，被合并的单元格需要用空白的单元格对象填补
            单元格对象型如cellItem中含有三个属性 v为文本，s为单元格style
             在cellItem中可以设置单元格的样式，如是否居中自动换行有无border,其中颜色都为十六进制去掉#的形式
            xlsx可以通过数组如cols的形式设置列宽，行高数组rows，
            另外可以设置单元格合并见数组merges，
            将以上定义的数组使用方法添加到sheet中
         
            */
            //创建一个表格使用aoa_to_sheet方法，传入二维数组tableArr,
            const sheet = xlsx.utils.aoa_to_sheet(tableArr);
            sheet["!merges"] = merges; // 将merges添加到sheet中设置合并单元格
            sheet["!cols"] = cols; // 将cols添加到sheet中设置列宽
            sheet["!rows"] = rows;// 将rows添加到sheet中，设置行高

            const workbook = XLSXS.utils.book_new(); // 创建虚拟的 workbook
            XLSXS.utils.book_append_sheet(workbook, sheet, "sheet1"); // 向 workbook 中添加 sheet
            XLSXS.writeFile(workbook, "xx表.xlsx"); // 导出 workbook
        }