excel 导出方法内部代码解读

excel导出方法内部代码解读

// 导出excel方法
// 参数1: 文件流对象; 参数2: 文件名称; 参数3: 文件后缀, 即文件格式
excelDownload(obj, name = Date.now(), suffix = 'xlsx') {
    // 创建 blob 对象对应的 url（即创建了一个 url，通过这个 url 可以获取到 blob 对象的信息，即文件流的内容）
    const url = window.URL.createObjectURL(
        new Blob([obj], { type: 'application/vnd.ms-excel' })
    )
    // 创建 a 标签元素
    const aDOM = document.createElement('a')
    // 不让 a 标签显示在页面中
    aDOM.style.display = 'none'
    // a 标签的路径
    aDOM.href = url
    // 文件名由传入的文件名和传入的后缀拼接而成
    const fileName = name + '.' + suffix
    // a 标签 download 属性用于下载文件
    aDOM.setAttribute('download', fileName)
    // a 标签添加至页面中
    document.body.appendChild(aDOM)
    // 调用 a 标签的点击方法
    aDOM.click()
    // 完成导出，从页面中移除 a 标签
    document.body.removeChild(aDOM)
},

具体使用及注意事项可以查看文章 Vue 项目前端根据文件流进行 Excel 导出。