前端js导出excel方法分享

最新推荐文章于 2024-07-29 10:13:34 发布

前端工程师申胥

最新推荐文章于 2024-07-29 10:13:34 发布

阅读量1.6k

点赞数

文章标签：前端程序员 js 编程

本文链接：https://blog.csdn.net/moonbc/article/details/89068424

版权

这篇博客分享了两种最新的前端使用JS导出Excel的方法，适用于Vue和React项目。方法一是通过CSV方式，处理数据并创建a标签实现下载；方法二是利用base64编码。内容包括数据处理、导出字段的注意事项以及示例代码。

摘要由CSDN通过智能技术生成

前言
之前写个js导出excel的方法，但是发现已经过时了，最近用了一下新的导出方式，可以用，现在分享一下。vue,react都可以用。原理就是通过table导出excel

方法一：
通过csv的方式导出

exportExcel() { // 前端导出excel
const types = { ‘DYNAMIC’: ‘动态创意’, ‘STATIC’: ‘静态创意’, ‘VIDEO’: ‘视频创意’, ‘MATERIAL’: ‘素材创意’ }
let currentGroup = ‘’
let exportData = this.showList.map(item => {
if (item.currentGroup) {
currentGroup = item.currentGroup
}
return {
creativeId: item.creativeId,
creativeName: item.creativeName,
description: item.description&& item.description.replace(/[\n\t\r，]/g,";"),// 把里面的回车和中文逗号换成分号
creativeSize: ${item.creativeWidth}*${item.creativeHeight},
creativeTime: this.getTime(item.startDate) + ’ - ’ + this.getTime(item.endDate),
creativesourceTyle: this.showType(item.creativeSource),
creativeTypename: types[item.creativeType]