js导出表格

js导出表格

概述：用a标签的download属性实现，用到字符串拼接
步骤：

// 导出表格函数
	function exportFile (content , fileName){
		// 字符串表头，以逗号隔开（英文逗号）表示不同列，\n换行
			let str = ‘姓名，年龄\n’
			for(let i=0;i<content.length;i++){
				for(let item in content[i]){
				    // \t是为了防止数字格式错误
					str+=`${content[i][item] + '\t'}`
				}
				str+='\n'
			}
			// 解决中文乱码问题encodeURIComponent
			// csv文件的BOM头:data:text/csv;charset=utf-8,\ufeff，特别指出 \ufeff是BOM头，可以让excel等识别出csv文件的编				码
			let uri = 'data:text/csv;charset=utf-8,\ufeff'+encodeURIComponent(str)
			// 创建a标签
			let a = document.createElement('a')
			a.href = uri
			// fileName文件名字
			a.download = fileName
			// 写入
			document.body.appendchild(a)
			// 模拟点击
			a.click()
			// 移除
			document.body.removechild)()
	}

使用：
写好html之后，写js实现导出功能即可
调用以上函数，传两个参（param1：需要导出的内容，param2：要导出的文件名称）
exportFile(param1, param2)
比如，传入name，age按列导出，导出文件名暂定为test.txt
const fileContent = [{name:‘a’,age:‘18’}，{name:‘b’,age:‘18’}，{name:‘c’,age:‘18’}]
exportFile (fileContent , ‘test.txt’)

使用tips：如果列里里面的内容有逗号的话，本来是这一列的内容会识别为两列，需要所有单元格数据不带逗号，当然如果有逗号你也可以replace，但是如果项目不提倡更改数据内容的标点符号的话，还是用插件吧，自己折腾了一下，js-xlsx

**npm install xlsx@0.14.5 --save // 注意版本号，8以下的不支持json_to_sheet的**

直接使用XLSX的工具类很方便

import XLSX from 'xlsx’
let worksheet = XLSX.utils.json_to_sheet(你想要导出的内容) // json格式转sheet A1：G5类似这种excel里的区域格式
let workbook = XLSX.utils.book_new()  // 新建表格
XLSX.utils.book_append_sheet(workbook,worksheet,sheet名称) // 写入表格
XLSX.writeFile(wb,文件名称，{bookType：‘xls'}) // 写文件

可以支持csv格式和excel的xls格式，txt格式，都支持的
注意一下导出csv格式的时候，用excel打开csv格式的文件时日期可能会出现##问题，这个不是插件的问题，你需要自己去excel里面设置日期显示格式，拉长单元格长度