SpreadJS 如何将自定义单元格导出到外部页面显示

收藏

前情提要：很多小伙伴在自定义单元格的时候将其导出为ssjson，然后导入到外部的Spread或者别的表单中。这时候会发现，导入的自定义单元格怎么没了？不是通过已经导入到ssjson里面了吗？如下图，自定义的下标无法在新的页面显示。
image.png283422240.png

其实，自定义单元格存储为ssjson然后导出到外部页面也是需要在外部的页面定义自定义单元格，因为自定义单元格生效是由于你执行了自定义的代码，但是导出的ssjson文件没有这个代码逻辑。要想使其生效，必须在外部的Spread或者导入的表单中也需要去定义该类型的自定义单元格。

因此我们想在新的页面或者外部页面显示该自定义单元格时，就需要在外部页面也定义该单元格类型。除了需要重新自定义单元格外，那么新的页面在什么时候该去识别这个自定义单元格呢？这时候需要通过原页面的typeName字段匹配。这个typeName相当于一个记号，告诉新的页面这是一个自定义单元格。在新的页面上，匹配上了，ssjson标记的自定义单元格也会显示。如下代码正是为原始页面中的自定义单元格添加上这么一个标记。

function HTMLCellType(items, size, isHorizontal) {
spreadNS.CellTypes.Text.apply(this, arguments);
this.typeName = "HTMLCellType"; //typeName属性标记
this.allowOverflow = false;
this._size = size;
}

复制代码

在原始的页面添加上标记后，如果自定义类型定义在一个闭包中，换句话说，你不希望将自定义类型定义在 window 对象上，你需要在新的页面上重写 getTypeFromString 函数来手动解析类型的字符串。

var oldFun = GC.Spread.Sheets.getTypeFromString;
// Private types can not be accessed from window, so override getTypeFromString method.
GC.Spread.Sheets.getTypeFromString = function(typeString) {
switch (typeString) {
case "HTMLCellType":
return HTMLCellType;
default:
return oldFun.apply(this, arguments);
}
};