应用场景
将网页上的table标签内容导出为excel,并且导出的excel携带样式,比如字色、背景色、对齐等等
实施步骤
必备引入包
npm install xlsx-js-style
步骤1:准备好table
table可以是已经存在与页面中的,也可以动态创建。
行列合并的设置都提前在table内设好。
步骤2:table转excel对象
import XLSX from 'xlsx-js-style'
//这是要导出的目标table
const table_dom=$('#table')[0]
//table转excel对象
const sheet = XLSX.utils.table_to_sheet(table_dom, {raw: true,
})
步骤3:设置excel的样式
//行列索引自行想办法拿到
const colIndex=0
const rowIndex=0
//获取excel的单元格对象
const cell = sheet[`${XLSX.utils.encode_col(colIndex)}${rowIndex+ 1}`]
if(cell){cell.s = {alignment: {horizontal: 'left'//水平对齐,},font: {bold: true//是否加粗,italic: false//是否斜体,sz: 12//字体大小,color: {rgb: '66ccff'//字色,不带#号的hex字符}},fill: {bgColor: {rgb: 'ffffff'//背景色}}}
}
步骤4:导出excel
const book = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(book, sheet, "Sheet1")
XLSX.writeFile(book, `export.xlsx`)
以上。
参考资料
xlsx-js-style封装自sheetjs,sheetjs文档没有对样式设置的描述。
excel对象的操作可参考
sheetjs中文网
样式设置参考
xlsx-js-style文档