nuxt导入、导出Excel表格

it2023-07-04  70

使用npm安装 npm install -S file-saver xlsx npm install -D script-loader

2.下载两个包,很重要。 引入Blob.js和expor2Excal.js 不用直接导入。自动匹配吧(大概) 3. 导入

<!-- // 导入 --> <el-upload class="upload-demo" action="" :on-change="handleChange" :show-file-list="false" :on-remove="handleRemove" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel" :auto-upload="false" > <el-button size="small" type="primary">批量上传</el-button> <div slot="tip" class="el-upload__tip"> 注:只 能 上 传 xlsx / xls 文 件 </div> </el-upload>

下边这个需要放到methods

importfxx(obj) { let _this = this; // 通过DOM取文件数据 this.file = obj; var rABS = false; //是否将文件读取为二进制字符串 var f = this.file; var reader = new FileReader(); FileReader.prototype.readAsBinaryString = function (f) { var binary = ""; var rABS = false; //是否将文件读取为二进制字符串 var pt = this; var wb; //读取完成的数据 var outdata; var reader = new FileReader(); reader.onload = function (e) { var bytes = new Uint8Array(reader.result); var length = bytes.byteLength; for (var i = 0; i < length; i++) { binary += String.fromCharCode(bytes[i]); } var XLSX = require("xlsx"); if (rABS) { wb = XLSX.read(btoa(fixdata(binary)), { //手动转化 type: "base64", }); } else { wb = XLSX.read(binary, { type: "binary", }); } outdata = XLSX.utils.sheet_to_json( wb.Sheets[wb.SheetNames[0]] ); //outdata就是读取excel内容之后输出的东西 this.da = [...outdata]; let arr = []; console.log(this.da);//关于这个地方很重要,因为设置的东西都在这里,循环遍历数据,按自己需要的数据格式打开 this.da.map((v) => { arr.push(v) }); //return arr // 把读取的excel表格中的内容放进tableData2中(这里要改成自己的表的名字) _this.tableData2 = _this.tableData2.concat(arr); }; reader.readAsArrayBuffer(f); }; if (rABS) { reader.readAsArrayBuffer(f); } else { reader.readAsBinaryString(f); } }, 导出 <el-button size="mini" @click="excelClick">导出</el-button> // 导出Excel excelClick() { console.log(this.orderList.dataArray); this.exportExcel() }, //导出的方法 exportExcel() { require.ensure([], () => { const { export_json_to_excel, } = require("@/utils/Export2Excel"); const tHeader = ["订单号", "商品金额","商品数量","商品规格","收货人","联系方式","收货地址"]; // 上面设置Excel的表格第一行的标题 const filterVal = [ "id", "oriPayMoney","oriNumber","oriSpecValue","oriConsigneeName","oriContact","oriAddress"]; // 上面的属性名里对象的属性名 const list = this.orderList.dataArray; //把data里的tableData存到list,把你想要的打印出来的数据放到这里来,this.orderList.dataArray是可以改变的 const data = this.formatJson(filterVal, list); console.log(data) export_json_to_excel(tHeader, data, "待发货"); }); }, formatJson(filterVal, jsonData) { return jsonData.map((v) => filterVal.map((j) => v[j])); }, 报错的地方 require('script-loader!file-saver'); require('./Blob');//这里需要改变一下,不然会报错,未定义 require('script-loader!xlsx/dist/xlsx.core.min');
最新回复(0)