下載SpreadJS最新試用版

前言

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

功能使用介紹:

序列化：

通過(guò)序列化可以將當(dāng)前的整個(gè)spread序列化成為JSON格式進(jìn)行存儲(chǔ)。通過(guò)spread.toJSON(serializationOption)方法就可以做到，方法中還提供一些選項(xiàng)可以用來(lái)控制序列化的結(jié)果：

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

反序列化：

通過(guò)反序列化可以將之前序列化的JSON格式的對(duì)象反序列化成為頁(yè)面進(jìn)行展示。通過(guò)spread2.fromJSON(json, jsonOptions)方法可以做到，同樣方法中也提供一些選項(xiàng)來(lái)控制反序列化的結(jié)果：

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

常見(jiàn)使用場(chǎng)景：

1、在設(shè)計(jì)器中使用序列化和反序列化：

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

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

2、差異化處理

在用戶(hù)的業(yè)務(wù)邏輯中經(jīng)常需要進(jìn)行一些差異化的處理，例如：填報(bào)模板的中設(shè)置的公式，不希望在導(dǎo)出的時(shí)候被導(dǎo)出。那么可以通過(guò)在tojson中進(jìn)行設(shè)置來(lái)忽略。

3、多列頭的導(dǎo)出

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

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

SpreadJS | 下載試用

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