使用js-export-excel
安裝插件
npm i js-export-excel
在需要的地方引入該模塊
import ExportJsonExcel from 'js-export-excel';//excel表格導出
給導出按鈕綁定事件
<Button type="primary" onClick={this.exportExcel}>導出</Button>
生成excel的代碼
//數(shù)據(jù)導出
? ? exportExcel = () => {
? ? ? ? const datas = this.state.data ? this.state.data : '';//表格數(shù)據(jù)
? ? ? ? var option = {};
? ? ? ? let dataTable = [];//新建數(shù)組放數(shù)據(jù)
? ? ? ? console.log(datas)
? ? ? ? if (datas) {
? ? ? ? ? ? for (const data of datas) {
? ? ? ? ? ? ? ? console.log(data)
? ? ? ? ? ? ? ? if (data) {
? ? ? ? ? ? ? ? ? ? let obj = {
? ? ? ? ? ? ? ? ? ? ? ? id: data.classid,
? ? ? ? ? ? ? ? ? ? ? ? name: data.classname,
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? dataTable.push(obj);
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? console.log(dataTable)
? ? ? ? option.fileName = '班級信息'//文件名
? ? ? ? option.datas = [
? ? ? ? ? ? {
? ? ? ? ? ? ? ? sheetData: dataTable,//數(shù)據(jù)
? ? ? ? ? ? ? ? sheetName: '班級信息',//sheet名字
? ? ? ? ? ? ? ? // sheetFilter: [dataTable.id, dataTable.name],//列過濾
? ? ? ? ? ? ? // sheetFilter 列過濾(只有在 data 為 object 下起作用)(可有可無)
? ? ? ? ? ? ? ? sheetHeader: ["班級編號","班級名稱"],//// 第一行
? ? ? ? ? ? }
? ? ? ? ];
? ? ? ? var toExcel = new ExportJsonExcel(option);
? ? ? ? toExcel.saveExcel();//保存
? ? }
詳情可以參考官方文檔：https://github.com/cuikangjie/js-export-excel
