合并table表头，导出excel的合并表头不起作用

收藏

导出之前：合并了1和2行
image.png804888305.png

导出后：

测试代码

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import '@grapecity/spread-sheets-resources-zh';
GC.Spread.Common.CultureManager.culture("zh-cn");
import GC from '@grapecity/spread-sheets';
import '@grapecity/spread-sheets-charts';
import { SpreadSheets, Worksheet } from '@grapecity/spread-sheets-react';
import { IO } from "@grapecity/spread-excelio";
import { jsonData } from './data';
import './styles.css';
const Component = React.Component;
const GCsheets = GC.Spread.Sheets;
window.GC = GC;
function _getElementById(id) {
return document.getElementById(id);
}
class App extends Component {
constructor(props) {
super(props);
this.spread = null;
this.importExcelFile = null;
this.exportFileName = "export.xlsx";
this.password = "";
}
render() {
return <div class="sample-tutorial">
<div class="sample-spreadsheets">
<SpreadSheets workbookInitialized={spread => this.initSpread(spread)}>
<Worksheet>
</Worksheet>
</SpreadSheets>
</div>
<div className="options-container">
<div className="option-row">
<div className="inputContainer">
<input id="exportFileName" defaultValue="export.xlsx" className="input" onChange={e=>this.changeExportFileName(e)}/>
<input type="button" id="saveExcel" defaultValue="export" className="button" onClick={e=>this.saveExcel(e)}/>
</div>
</div>
<div className="option-row">
<div className="group">
<label>Password:
<input type="password" id="password" onChange={e=>this.changePassword(e)}/>
</label>
</div>
</div>
</div>
</div>;
}
initSpread(spread) {
this.spread = spread;
spread.suspendPaint();
let sheet = spread.getActiveSheet();
let data = {
name: 'Jones', region: 'East',
sales: [
{orderDate: '1/6/2013', item: 'Pencil', units: 95, cost: 1.99, isDelivered: '是'},
{orderDate: '4/1/2013', item: 'Binder', units: 60, cost: 4.99, isDelivered: ''},
{orderDate: '6/8/2013', item: 'Pen Set', units: 16, cost: 15.99, isDelivered: ''}
]
};
let table = sheet.tables.add('tableSales', 1, 0, 5, 5);
table.autoGenerateColumns(false);
this.table = table;
table.style(GCsheets.Tables.TableThemes["medium4"]);
let tableColumn1 = new GCsheets.Tables.TableColumn(1, "orderDate", "名称", "yyyy-mm-dd");
let tableColumn2 = new GCsheets.Tables.TableColumn(2, "item", "名称1");
let tableColumn3 = new GCsheets.Tables.TableColumn(3, "units", "名称2");
let tableColumn4 = new GCsheets.Tables.TableColumn(4, "cost", "名称3", null, null);
let tableColumn5 = new GCsheets.Tables.TableColumn(5);
table.bind([tableColumn1, tableColumn2, tableColumn3, tableColumn4, tableColumn5], 'sales', data);
sheet.setColumnWidth(0, 120);
sheet.setColumnWidth(1, 120);
sheet.setColumnWidth(2, 120);
sheet.setColumnWidth(3, 120);
sheet.setColumnWidth(4, 120);
sheet.addSpan(0, 0, 2,1);
sheet.setValue(0, 0,'名称');
spread.resumePaint();
}
changeFileDemo(e) {
this.importExcelFile = e.target.files[0];
}
changePassword(e) {
this.password = e.target.value;
}
changeExportFileName(e) {
this.exportFileName = e.target.value;
}
changeIncremental(e) {
_getElementById('loading-container').style.display = e.target.checked ? "block" : "none";
}
loadExcel(e) {
let spread = this.spread;
let excelIo = new IO();
let excelFile = this.importExcelFile;
let password = this.password;
let incrementalEle = _getElementById("incremental");
let loadingStatus = _getElementById("loadingStatus");
// here is excel IO API
excelIo.open(excelFile, function (json) {
let workbookObj = json;
if (incrementalEle.checked) {
spread.fromJSON(workbookObj, {
incrementalLoading: {
loading: function (progress, args) {
progress = progress * 100;
loadingStatus.value = progress;
console.log("current loading sheet", args.sheet && args.sheet.name());
},
loaded: function () {
}
}
});
} else {
spread.fromJSON(workbookObj);
}
}, function (e) {
// process error
alert(e.errorMessage);
}, { password: password });
}
saveExcel(e) {
let spread = this.spread;
let excelIo = new IO();
let fileName = this.exportFileName;
let password = this.password;
if (fileName.substr(-5, 5) !== '.xlsx') {
fileName += '.xlsx';
}
let json = spread.toJSON({
includeBindingSource: true,
ignoreStyle: false,
ignoreFormula: true,
saveAsView: true,
includeAutoMergedCells: false
});
// here is excel IO API
excelIo.save(json, function (blob) {
saveAs(blob, fileName);
}, function (e) {
// process error
console.log(e);
}, { password: password });
}
}
ReactDOM.render(<App />, _getElementById('app'));