下載SpreadJS最新試用版

前言

SpreadJS表格控件有著很強大的功能：序列化與反序列化表格。熟練使用該功能達到加快開發(fā)進度，減少代碼量，降低業(yè)務邏輯復雜度，處理一些特殊邏輯需求等效果。

功能使用介紹:

序列化：

通過序列化可以將當前的整個spread序列化成為JSON格式進行存儲。通過spread.toJSON(serializationOption)方法就可以做到，方法中還提供一些選項可以用來控制序列化的結果：

var serializationOption = {
    ignoreFormula: true, // 如果設置為true則忽略公式，不會序列化公式，只會將公式計算的結果序列化到JSON中。
    ignoreStyle: true, // 如果設置為true則忽略樣式，所有style中的屬性將不會序列化到JSON中
    rowHeadersAsFrozenColumns: true, // 將行頭轉換為凍結列序列化
    columnHeadersAsFrozenRows: true, // 將列頭轉換為凍結行序列化
    includeBindingSource: true // 將數(shù)據(jù)綁定的數(shù)據(jù)源也序列化到json中
}

反序列化：

通過反序列化可以將之前序列化的JSON格式的對象反序列化成為頁面進行展示。通過spread2.fromJSON(json, jsonOptions)方法可以做到，同樣方法中也提供一些選項來控制反序列化的結果：

var jsonOptions = {
    ignoreFormula: true, // 如果設置為true則忽略公式，反序列化時忽略公式，只會將公式計算的結果反序列化展示到頁面中。
    ignoreStyle: true, // 如果設置為true則忽略樣式，不會將style中的屬性反序列化展示
    frozenColumnsAsRowHeaders: true, // 將凍結列轉換為行頭           
    frozenRowsAsColumnHeaders: true, // 將凍結行轉換為列頭
    doNotRecalculateAfterLoad: true, //  反序列化后公式不進行重新計算
}

常見使用場景：

1、在設計器中使用序列化和反序列化：

通過SpreadJS提供的設計器可以快速的進行模板設計，設計器中可以通過拖拽，點擊，配置等操作快速進行模板設置從而節(jié)省大量的代碼編輯操作。當在設計器中設計好模板之后可以通過設計器提供的導出功能，將模板導出成ssjson文件（該文件就是將序列化toJSON之后生成JSON格式保存成的文件）。

在頁面展示的時候我們可以在js中讀取該文件（例如jquery的\$.getJSON()，通過js文件讀取等方式），并將獲取到的json對象通過spread.fromJSON反序列化成頁面展示。這樣就完成了模板的快速構建。

2、差異化處理

在用戶的業(yè)務邏輯中經(jīng)常需要進行一些差異化的處理，例如：填報模板的中設置的公式，不希望在導出的時候被導出。那么可以通過在tojson中進行設置來忽略。

3、多列頭的導出

SpreadJS中有一些擴展的功能例如多列頭是Excel不支持的，而該功能經(jīng)常在業(yè)務邏輯中被使用，所以如果有同時需要導出Excel的處理這種魚和熊掌不可兼得的事情往往會產(chǎn)生很多困擾，那么為了解決這樣的問題，在導出之前的toJSON時就可以通過設置columnHeadersAsFrozenRows屬性，之后將生成的json在導出時傳遞給ExcelIO，這樣導出的Excel中會將SpreadJS的多列頭通過凍結行來進行顯示。例如下面的表格：

設置了多行頭與多列頭，要想導出Excel中包含行頭和列頭的信息，可以在toJSON的時候設置rowHeadersAsFrozenColumns與columnHeadersAsFrozenRows這兩個屬性，那么導出之后就可以將行頭列頭信息顯示在Excel中，像這樣：

SpreadJS | 下載試用

純前端表格控件SpreadJS，是市面上布局與功能都與 Excel 高度類似的一款表格控件，全中文操作界面，適用于.NET、Java、移動端等多個平臺的類 Excel 數(shù)據(jù)開發(fā)，備受華為、中通、民航飛行學院等國內知名企業(yè)客戶青睞。