vue3.x 中使用 XLSX 提取 excel 工作表中的公式

最近在做关于Excel 导入的项目，后端太忙了，前端先处理excel公式，我使用 XLSX 这个npm 包来处理，希望是个不错的选择！

第一步 安装 npm install XLSX  或者 yarn add XLSX ， 我使用的是后者！

第二步 写好上传 的按钮 ，这里使用的是element-ui plus 的组件 el-upload，代码如下：

<el-upload
    action=""
    :auto-upload="true"
    :before-upload="readExportExcelFile"

>
    <el-button type="primary">上传报表模板</el-button>
</el-upload>

第三步：实现  readExportExcelFile  方法：

// 点击导入excel， 获取excel的表（sheet ）
const readExportExcelFile = (file)=>{
    /* 读取Excel */
    const reader = new FileReader();
    reader.onloadstart = (e)=>{
        loading.value = e.target.readyState
    }
    reader.onprogress = (e)=>{
        loading.value = e.target.readyState
    }
    reader.onload = (e) => {
        /* 解析数据 */
        const bstr = e.target.result;
        workbook.value = XLSX.read(bstr, { type: 'binary'}); // 缓存 excel 解析内容
        sheets.value =  workbook.value.SheetNames; // 获取 缓存 excel 中所有表 （sheet ）
        proxy.$modal.msgSuccess("导入成功！")
    }
    reader.onloadend = (e)=>{
        loading.value = e.target.readyState
    }
    reader.onerror = (e) =>{
        proxy.$modal.msgError("文件读取时发生错误！")
    }
    reader.readAsBinaryString(file);
    return false;
}

就这样，就成功拿到了excel 表中拿到workbook 和 sheets 数据啦！

第四部 获取 某个sheet 中的公式  wsname 参数表示sheet 名称

XLSX.utils.sheet_to_formulae 提取公式

MatchExcelFormulaReg 正在表达式过滤出有效的公式

const MatchExcelFormulaReg = /^([A-Z]+\d+=)(?!(\'|\d))./g // 排除 数据报表模板公式中的 中文和数值，中文是以 ' 开头的
// 选择某个表（sheet ），获取表中公式（formulae）
const getFormulae = (wsname)=>{
    if(workbook.value){
        const ws =  workbook.value.Sheets[wsname];
        let sheetToFormulae = XLSX.utils.sheet_to_formulae(ws) // 提取公式
        const formulae = sheetToFormulae.filter(z=>z.match(MatchExcelFormulaReg)) // 过滤出需要的公式，例如：A3=A1+A2
        return formulae
    }
} 

这样提取公式的目的就达到了！

在这个功能开发过程中经常需要用到正则！我也因此不得不学会写一些正则，有收获！