设计logo网站免费奇米,关键词搜索站长工具,石景山网站开发,编程软件wordpress一、使用
有时项目中有需要前端自己将本地的excel文件导入并获取内部数据#xff0c;最终处理数据#xff08;批量导入等场景#xff09; 这时我们就可以用到一个库#xff08;xlsx#xff09;来读取excel中的内容#xff0c;然后通过其API能力将数据转换成json格式
具…一、使用
有时项目中有需要前端自己将本地的excel文件导入并获取内部数据最终处理数据批量导入等场景 这时我们就可以用到一个库xlsx来读取excel中的内容然后通过其API能力将数据转换成json格式
具体使用如下 const TABLE_HEADER_ENUM {姓名: name,工号: workId,班次: shift,月份: month,日期: date,年份: year};// 导入const fileImport file {// 通过FileReader对象读取文件const fileReader new FileReader();fileReader.onload event {try {const { result } event.target;// 以二进制流方式读取得到整份excel表格对象const workbook XLSX.read(result, { type: binary });// 存储获取到的数据const data {};const tempData [];// 遍历每张工作表进行读取这里默认只读取第一张表for (const sheet in workbook.Sheets) {if (Object.prototype.hasOwnProperty.call(workbook.Sheets, sheet)) {// 利用 sheet_to_json 方法将 excel 转成 json 数据data[sheet] tempData.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));}}const firstSheetData data[Object.keys(workbook.Sheets)[0]];const importData [];firstSheetData.forEach(item {const itemObj {};for (const attr in item) {const key TABLE_HEADER_ENUM[attr] ? TABLE_HEADER_ENUM[attr] : attr; itemObj[key] item[attr];}importData.push(itemObj);});// 这里最终处理完的importData就是一个对象数组} catch (e) {Message.error(e.message || 文件导入失败,);}};// 以二进制方式打开文件fileReader.readAsBinaryString(file[0].originFileObj);};备注 上文中的TABLE_HEADER_ENUM 是一个标题的中英文映射对象因为我们excel表中标题经常是中文的但接口中的传递字段基本都为英文所以这个由你们实际excel表中的标题自定义 总结
这里我就简单记录下有需要的小伙伴可以参考下
