导出文件的方法总结

1.导出文件-（请求后端数据）

/**
 * 导出文件
 * @param url  导出请求的api
 * @param name 导出文件的名称
 * @param data 导出文件的数据
 */
        Vue.prototype.exportFile = function ({ url = '', name = '', data = {}}) {
            let xmlResquest = new XMLHttpRequest()
            xmlResquest.open('POST', url, true)
            xmlResquest.setRequestHeader('Content-type', 'application/json')
            xmlResquest.setRequestHeader("x-access-token", store.state.state.login.access_token);
            if(vm.$route.path.split('/')[1] === 'channelMgs' && this.$store.state.state.login.channelId){
                xmlResquest.setRequestHeader('bbxc-channel-id', this.$store.state.state.login.channelId)
            }
            xmlResquest.responseType = 'blob'
            xmlResquest.onload = function () {
                let reader = new FileReader()
                // 文件转码
                reader.onload = e => {
                    // 如果有错误信息则弹出
                    try {
                        let json = JSON.parse(e.target.result)
                        vm.$message({
                            message: json.message,
                            type: 'error'
                        })

                        // 解析成对象失败，说明是正常的文件流
                    } catch (err) {
                        let content = xmlResquest.response
                        let elink = document.createElement('a')
                        elink.download = name
                        elink.style.display = 'none'
                        let blob = new Blob([content])
                        elink.href = URL.createObjectURL(blob)
                        document.body.appendChild(elink)
                        elink.click()
                        document.body.removeChild(elink)
                    }
                }
                reader.readAsText(xmlResquest.response)
            }
            // 发送http请求
            xmlResquest.send(JSON.stringify(data))
        }

2.导出文件-(前端的静态导出)

/**
  * 前端静态导出(支持多级表头合并)
  * @param excelName  导出文件名称
  * @param refs  表格的refs
  */
        Vue.prototype.staticExportFile = function (excelName,refs) {
            // 样式设置
            function setExlStyle(data) {
                let borderAll = {  //单元格外侧框线
                    top: { style: 'thin' },
                    bottom: { style: 'thin'},
                    left: { style: 'thin' },
                    right: { style: 'thin' }
                };
                let borderOther = {
                    left: { style: 'thin' }
                }
                data['!cols'] = [];
                for (let key in data) {
                    let empty = false
                    if (data[key] instanceof Object) {
                        if(data[key].v === '$-$'){
                            empty = true;
                            data[key].v = ''
                        }
                        data[key].s = {
                            border:empty ?borderOther:borderAll,
                            alignment: {
                                horizontal: 'center',   //水平居中对齐
                                vertical:'center'
                            },
                            font:{
                                sz:11
                            },
                            bold:true,
                            numFmt: 0
                        }
                        data['!cols'].push({wpx: 115});
                    }
                }
                return data;
            }
            function exportExcel(excelName,refs) {
                const $e = refs.$el
                // 多余块，填充标识
                $e.querySelectorAll('.el-table__header-wrapper th.gutter').forEach(item=>{
                    item.innerHTML = '$-$'
                })
                let $table = $e.querySelector('.el-table__fixed')
                if(!$table) { $table = $e }
                let wb = XLSX.utils.table_to_book($table,{sheet:'table',raw:true})
                setExlStyle(wb['Sheets']['table'])
                let ws = XLSXS.write(wb, { type: "buffer" });
                try {
                    FileSaver.saveAs(
                        new Blob([ws], { type: "application/octet-stream" }),`${excelName}.xlsx`
                    );
                } catch (e) {
                    if (typeof console !== "undefined") console.log(e, ws);
                }
                return ws;
            }
            exportExcel(excelName,refs)
        }